Stephon RuddIndependent projects & systems

Independent build / Custom web platform

CASE STUDY 02

One platform.
Written from
a blank file.

Cyphon Media gives faith-driven businesses a free one-page website, then grows the relationship from there. I designed and hand-coded the whole system behind it: the public site, a client questionnaire, a private client portal, an admin dashboard, an email engine, live chat, analytics, and a desktop companion app.

See how it works Visit live website
Project owner
Stephon Rudd
My role
Design, development & QA
Operating model
Solo build
Stack
PHP · MySQL · JavaScript

01 / The challenge

Run a whole agency
from one system.

Cyphon Media needed to capture leads, collect detailed project briefs, show clients their site before handoff, keep every conversation in one place, follow up by email, and present upgrades. I wanted all of it in one system I controlled, not spread across a stack of subscriptions.

No WordPress, page builder, or starter template. Every page, database table, and endpoint was written for this project.

I built the platform from scratch over about two months, from the first line of code through the last round of bug fixes.

The site is one application in custom PHP and MySQL with plain JavaScript on the front end. Visitors, clients, and the admin each have their own interface, and all three share one database and one set of business rules. A desktop app connects to the same backend so I can answer visitors without keeping a browser tab open.

Built from scratchClient portalAdmin dashboardEmail automationSecurity-first
Lines of PHP written for this project
18,000+
API endpoints behind the interfaces
45
Database tables designed for the platform
24
CMSs, frameworks, or templates used
0

02 / The platform

Four connected
parts, one backend.

Each audience gets an interface built for its job. Underneath, they read and write the same records, so a status change in the admin shows up in the client portal and sends the right email.

Platform structure. Every part runs on the same custom codebase and database.
01

Capture the email first

The homepage asks for only a few fields. The contact is saved before the longer questionnaire, so people who stop partway can still get follow-up.

02

One source of truth

Projects move through a single status pipeline. Each change updates the portal, sends notifications, and starts or stops email sequences automatically.

03

Keep the personal close

Upgrade requests notify me instead of charging a card. I follow up personally and send a payment link, which suits the relationship-based offer.

03 / How the site works

From first visit
to finished site.

The core of the platform is a client journey with four stages. Each stage hands off to the next on its own, and I step in only where a person adds value: building the site and closing upgrades.

The client journey

Automated hand-offs · Manual build & close
  1. Homepage · about 30 seconds

    Capture the lead

    A short form saves the contact, tags it by business type and goal, adds it to the mailing list, and opens the questionnaire with their details filled in.

  2. Questionnaire · 3 steps

    Collect the brief

    The brief saves as they type, in the browser and on the server, so they can finish on another device. Submitting creates the project, sets their portal password, and alerts me.

  3. Portal · in review

    Preview & revise

    The client reviews the real site inside the portal through a protected preview, then requests changes in the project's message thread.

  4. Portal · delivered

    Deliver & grow

    Marking the project delivered unlocks the files to download free, starts the follow-up emails, and opens the Grow tab's upgrade path.

Every status change

Portal update · Client email · In-app notification · Contact tags The pipeline runs Received → Building → In Review → Revision → Delivered → Paid.

Flow as built in the platform's code. Building each site and closing upgrades are the two steps I do by hand.

Every major feature

Filter by area, then open a feature for details. All of it is custom code; the two outside libraries are noted where they appear.

Public siteTwo-stage lead capture
The homepage form saves the contact as soon as it's submitted, before the longer brief.
  • Tags the contact by business type and page goal
  • Sends the contact to the mailing list and starts the drop-off nudge sequence
  • Carries the visitor's details into the questionnaire
  • Shows a live founding-spots count that I set from the admin
Public siteMulti-step questionnaire with autosave
A three-step brief: basic info, the full brief, and review & send.
  • Saves in the browser and on the server so it can be resumed on another device
  • On submit, creates a project ID, stores the brief as structured data and readable Markdown, and sets the client's portal password
  • Alerts me and cancels the drop-off emails
Public siteLive chat with automatic FAQ fallback
A chat widget on every public page.
  • When I'm online, messages go to my inbox in the admin and the desktop app
  • When I'm offline, it answers from an FAQ list I edit in the admin, matched by keyword
  • I can also message a visitor first, straight from the live-activity feed
Client portalPrivate client accounts
Clients sign in with the email and password they set in the questionnaire.
  • Tabs for Overview, Preview, Messages, Files, Grow, and Profile
  • The overview explains what happens next at each project status
  • Password resets come as a one-time link I send from the admin
Client portalProtected site preview
The client's site loads in a frame through a script that checks it is their project and that it is ready to view.
  • Adds a watermark with the client's name
  • Blocks right-click, text selection, and common copy and view-source shortcuts
  • The preview files sit outside the public web folder
Client portalMessages, files & growth path
Each project has its own message thread with read tracking on both sides.
  • Files unlock for download once the project is delivered
  • Every download checks who is signed in and confirms the file is inside the upload folder
  • The Grow tab lays out the upgrade ladder, and each Request button records the request and notifies me
AdminProject pipeline & detail view
Each project has a detail page with tabs for Brief, Status, Chat, Files, Notes, and Add-on Requests.
  • Move the project one step at a time or jump to any status
  • Upload the preview and deliver files
  • Send a sign-in link, or view the portal exactly as the client sees it
AdminLeads, clients & revenue
Separate views for opt-in leads who haven't started the brief, submitted leads, clients, and revenue.
  • The dashboard totals active projects, new leads, opt-ins, open founding spots, and revenue
  • A live-activity feed shows who is on the site and on which page
  • Records can be converted or deleted from the list
AdminBuilt-in analytics & reports
First-party visit and page-view tracking, with no third-party analytics needed for the core numbers.
  • Visitors, opt-in rate, bounce rate, and average visit length, filtered by date range
  • A conversion funnel and step-by-step questionnaire drop-off
  • Traffic sources and campaign tags
  • Exports a report as JSON or Markdown
AdminContent & site settings
The parts of the site that change often are editable without touching code.
  • Email templates
  • Chat FAQ answers
  • The services and add-on catalog
  • An error log panel that records server-side problems for review
AutomationNative email engine
Contact tags, sequence enrollments, and a send queue, all in the platform's own database.
  • Each email is scheduled when the contact enrolls
  • A scheduled task sends whatever is due
  • Every marketing email has an unsubscribe link that works without signing in, and unsubscribes are honored immediately
  • Sends through SMTP using PHPMailer, an open-source library
AutomationPayments & webhooks
Upgrades are closed by hand with a payment link. Add-on invoices are built from catalog prices.
  • Stripe webhook events are accepted only with a valid signature from the last 5 minutes
  • A confirmed payment updates the project and records the revenue
  • Uses the official Stripe PHP library for the API calls

04 / Security & reliability

Protections written
into every layer.

Without a CMS, I had to build the security myself. Each protection below is part of the platform's own code and deployment process.

Safe database access

Every query uses prepared statements, and all output is escaped before it reaches the page.

Protected forms

Forms that change data require a per-session CSRF token.

Secure sign-in

Passwords are hashed with bcrypt. Sign-in links are hashed, single-use, expire in 24 hours, and are limited to 3 per hour.

Rate limiting

A shared rate limiter stores request counts in the database to slow down abuse of sensitive endpoints.

Verified payments

Webhook events are checked against Stripe's signature before anything is updated.

Locked-down files

Uploads are checked by file type and renamed. Downloads confirm ownership and block paths outside the upload folder.

Secrets off the web

Keys and passwords live in a config file above the public folder, and server rules block docs, installers, and config files.

Controlled deployment

Only files the site needs are uploaded. After each deploy, I confirm that private files return an error.

05 / Desktop companion

Answer visitors
without a browser tab.

I also built a small desktop app with Electron. It signs in to the same backend and runs in the system tray, so visitor chats reach me while I work in other programs.

  • 01
    Online / offline switchGoing online sends a check-in every 20 seconds, which switches the site's chat from FAQ answers to live replies.
  • 02
    Conversations & live activityPolls for new chats and current visitors, and replies through the platform's API.
  • 03
    Native notificationsNew messages trigger a desktop notification, and the tray icon shows my status.
Simplified illustration of the desktop app's layout, not a screenshot.

06 / The build

Two months.
Built and debugged.

I built the platform from nothing in about two months, including the time spent finding and fixing bugs. I wrote a spec first, built and tested on a local copy, and moved changes to the live server only after they passed.

Week 1 · blank fileWeek 8 · live & stable

Tools in the workflow

PHP 8MySQLJavaScriptDockerVS CodeClaude CodeGitElectronStripe API
Built from scratch, not adaptedNo existing software was installed and customized. There is no CMS, framework, theme, or template; the pages, database, and business logic were all written for this project. Two open-source libraries handle sending email (PHPMailer) and Stripe API calls, and I used AI tools to help write, review, and debug the code.

  1. Write the spec first

    I documented the offer, the client journey, the database, and the security rules, and kept that document as the source of truth as the build changed.

  2. Build in a local copy

    A Docker setup with PHP and MySQL containers mirrors the live server, so nothing is tested on the real site.

  3. Build in layers

    Database first, then the public funnel, the client portal, the admin dashboard, and finally the email engine, chat, analytics, and desktop app.

  4. Test against a written checklist

    A testing protocol covers security, dead code, broken links and buttons, and every feature end to end. One security audit found and fixed seven issues, including a broken free-download check, add-on prices that could be tampered with, and an unprotected delete path.

  5. Deploy carefully

    An allow-list controls which files go live, and checks after each deploy confirm private files are blocked.

08 / The result

A complete platform.
Run by one person.

The routine work runs on its own: capturing leads, collecting briefs, following up, tracking visitors, and keeping clients updated. That leaves my time for building each site and talking with clients. Because I wrote all of it, I can change any part of it without waiting on a vendor or working around a plugin.

Explore CyphonMedia.com
  • Custom PHP & MySQL application
  • Lead capture & 3-step questionnaire
  • Client portal with protected previews
  • Admin dashboard & analytics
  • Native email engine & live chat
  • Electron desktop companion

09 / Transferable skills

What I bring
to the next project.

This project covers the full life of a software product: planning, building, testing, securing, deploying, and running it. Those skills carry into development, quality assurance, operations, and automation roles.

Full-stack development

Designing a database, writing server-side logic and APIs, and building interfaces for three kinds of users.

In this project: 45 endpoints and 24 tables, written from scratch.

QA & debugging

Testing against a written protocol, tracing problems to their source, and confirming the fix before release.

In this project: a security audit that closed seven issues.

Workflow automation

Turning a business process into triggers, queues, and notifications that run without manual effort.

In this project: email sequences that start and stop based on client status.