A therapist's whole practice, online.
Through Smart Civic Solutions, I lead a team of five designers and developers on the full digital presence of Yasmine Madkour, a somatic trauma therapist in Egypt. Her site speaks English and Arabic, and the Arabic truly mirrors, right to left, instead of sitting in an English layout.
- Software engineering team lead
- Five designers and developers
- English, and Arabic mirrored right to left
- September 2024
Four parts, one practice
The front door
A bilingual site, English and Arabic, rebuilt around her brand and mirrored properly in both directions.
The front desk
Separate paths for new and returning clients, in both languages, and program times and countdowns shown in each visitor's own time zone.
The back office
An admin that went from long technical forms to visual page builders, so her team can change almost anything, in both languages, without calling a developer.
The manual
When the system grew past what anyone could hold in their head, I wrote it down: a documentation site covering every part of it, from the platform to the page builder to operations. The storyboards were exported once into one checked package, so every teammate, and every AI agent working with us, builds from the same source.
Eight releases in five months.
Between February and June, the admin turned into a set of visual builders. Each release handed her team one more thing they could change themselves.
From long technical forms
to visual builders her team runs
Time zones
Schedules and countdowns that follow each visitor's clock, across more than thirty time zones.
FAQ order
Questions her team can reorder by dragging.
Pricing plans
A manager for plans, prices, and what each includes.
After checkout
Thank-you pages her team builds themselves, each with its own link the moment it exists.
Every page
A page builder for the whole site, with a drag-and-drop menu manager.
Product pages
Nine kinds of sections and one shared way to set what every button does.
Community
An editable community page with a searchable icon picker.
Long pages
Faster editing for the longest pages.
Every icon, editable.
Her brand has four hundred eighty-four icons in twenty-one families. I decided every icon a visitor can see should be changeable from one place, and that the place should show each icon where it's actually used, not in a list of file names.
Invited, not required.
Her homepage tells visitors what trauma really is, as a short story around a bowl. The first nine attempts at making it interactive didn't feel right, and I worked out why. They were one idea in nine costumes: each asked the visitor to perform a gesture, fill a hidden meter, and unlock the next part. That's how games work. It's the opposite of how a body-based therapy feels.
So instead of drawing a tenth version, I wrote down rules.
Invited, not required.
Instead of performing a gesture.
Responsive, not demanding.
Instead of unlocking the next part.
Obvious, not explained.
Instead of filling a hidden meter.
- Perform a gesture
- Fill a hidden meter
- Unlock the next part
In the end I dropped scrolling altogether. The story now plays like a short film, and it starts only when the visitor chooses to start it.
Before
The page's scroll drove the story, frame by frame.
Now
A short film that plays only when the visitor starts it.
The empty grid.
Her team built a page with a block of related programs. It looked right in the editor and showed nothing on the live site. The programs were saved and readable. The block was asking for them from the wrong side, and every failure was quietly turned into nothing. I fixed both ends: the site now shows only programs that are live and complete, and the editor won't let anyone save a program that visitors can't see.
Editor
The programs are saved and readable.Live site, before
The block asked from the wrong side, and every failure became nothing.Live site, after
Shows only live, complete programsCan't save what visitors can't see
Eight kinds of done.
When I prepared the project to be handed on, I separated eight things people usually call done. Every status now names which one is proven. I held my own work to it too: when the evidence changed, I marked my own earlier completion report as a draft, not the truth.
Completion report
- Code exists
- Code merged
- Data exists
- Review passed
- Tracker says live
- Criteria signed
- Client accepted
- Production authorized
The hard part of this work isn't the code. A therapist's site is often the first thing someone sees on a hard day. Every word, and every step of booking, has to feel calm.
Beyond this practice
Smart Civic also works with international development organizations on training and civic initiatives. I've contributed to several of them, including the training films in the next room.