I shape everyday tools and digital products for any screen. By bridging human psychology, visual craft, and code, I turn complex problems into effortless interactions. In my latest role as Lead Product Designer, I guided a luxury mobile app from concept to launch, uniting fine-art UI finishes with dozens of bespoke, highly engaging features.
TexiTexi is an app for reading and writing plain text. It holds tens of thousands of free books, lets people turn lines they love into quote cards to share, and has a reader made for long texts in any language, whether it reads left to right or right to left. This case study shows how I designed it, from the first problem to the last detail.
Texi is built by a very small team. There is one designer and one engineer, and we work side by side in the same app, so a decision made on a screen reaches real users without a long hand-off.
Lead Product Designer
Most of the world's writing is hard to read well. It is spread across many places, wrapped in images, counters and recommendations that pull attention away, and often not built for people who read in another script or direction, who use a screen reader, or who simply want to read in peace.
Texi's answer is a quiet place for plain text. It has a published code: no likes, no comments, no view counts, no follower counts, no rankings, no suggestions, no tracking and no images. For a designer those rules are not limits to work around. They are the brief. Everything the app feels like has to come from type, colour and space.
I did not run interviews or usability studies. I found the friction the way a reader meets it, by using and checking the live product:
These pain points come from that observation and from design reasoning, not from research findings.
Texi is for anyone who wants to read in peace, so I kept three very different readers in mind at every step: a young student, a lifelong novel lover and a professor who reads in two directions at once. Each one tested a different part of the design.
19, Mexico · First-year literature student
38, Ghana · Everyday reader who loves novels
64, Lebanon · Philosophy professor and researcher
Names and portraits are illustrations of the people I designed for.
The seven steps map onto the five stages most product teams use: Empathize, Define, Ideate, Prototype, Test. The difference is where each stage happens: inside the live, running app, not on a whiteboard or in a static mockup.
Noticed by using and auditing the product, for example Cover, Profile and Quote each speaking a different visual language, or filtering behaving differently from screen to screen.
Audit the live product end to end, every screen and every control, and check it against Google's design guidelines (Material 3) and accessibility advice. This is product and standards research, not user interviews.
Specify several directions for each problem, for example a few palette options for the colour swatches, or a hand-picked against an automatically derived two-tone background.
Settle it by comparing the options in the live app, not on paper. Both are built and used on the same real data and device, and the one that holds up stays.
A specification becomes a real screen almost at once, so every prototype is already a working, interactive, full-quality screen, not a static mockup.
Review the built screen on a real device with real data. This is how the day/night toggle that stuck after the first tap was caught and fixed at its source.
Iterate, revert where needed, and ship whatever holds: sometimes the first direction, sometimes the third.
Why it matters. Because the design is directed straight into the live app, there is no hand-off wall between designed and built. The whole loop from empathy to test happens in one place for each decision, which is what makes the list of reversals later on this page possible. The comparing works like an A/B test, done by direct, critical review rather than an experiment with split traffic: no analytics or user-testing tools were part of it.
People can dress their own text in four places in Texi: a book cover, a public profile, an invitation card and the quote cards that sit at the heart of the app. Each place started with its own editor, built at a different time with different assumptions. A frame in one editor was not quite the same frame in another, the controls sat in different spots, and anyone who learned one had to learn the next from scratch.
7 books
A. N. Author
A short treatise that looks at how light and darkness shape what we see. It joins plain observation with careful thought, and it was written for readers who simply like to wonder why colours look the way they do. Every chapter starts from something you can try yourself.
English · Roboto
M. Writer
A tale of ambition and consequence, told through letters and a long journey north. It follows one person who tries to master something far too large, and the stranger he meets along the way, whose story is a warning about reaching too far without care for what follows.
English · Roboto
4 quotes
Infinitely various are the means by which we become acquainted with these general movements and tendencies: now as a simple repulsion, now as an attraction, now as an upsparkling and vanishing light, now as a gentle glow in the air. Always, uniting or separating, the great purpose is found to be to excite and promote existence in some form or other.
It may naturally be asked whether, in proposing to treat of colours, light itself should not first engage our attention: to this we briefly and frankly answer that since so much has already been said on the subject of light, it can hardly be desirable to multiply repetitions by again going over the same ground.
An Author
A collection of short poems about the heart and the seasons. The work gathers small, calm pieces on love and change.
A. Writer · Quiet Verses
71,334 free books from around the world.
Scan for 7 days of Premium
I laid the four editors side by side and listed every control. The overlap was much larger than the differences. All four asked the same five questions about a rectangle of text: what colour, which frame, which pattern, which background or texture, and which font and size. Only the words changed: a title and author on a cover, a name on a profile, an invitation line, a quote.
The first draft of anything is plain text.Texi
A simplified illustration of the idea. The proportions and sample text here are illustrative, not production layouts.
In Texi, colour frames the words. The first palette was a handful of hand-picked colours. It grew into 46 themes without turning into a pile of swatches, and every one of them has to stay readable in both day and night.
Letting people choose a colour is easy. Making the whole app, buttons, cards, menus, icons and the reader, look right in any colour is hard. A flat list of 46 accent colours would give 46 chances to get readability wrong, and people would only meet the ones that happen to look good.
I grouped themes by how people describe their taste, not by hue:
| Group | Count | Idea |
|---|---|---|
| Content | 12 | One colour, and the app follows it. |
| Duo-tone | 11 | Two colours that belong together, such as turquoise and sand. |
| Tri-tone | 13 | A flag, a season or a mood. |
| Monochromatic | 10 | Calm: one colour in many shades, nothing competing with the text. |
Settings shows these as four short tabs. Four short groups are easy to scan. One list of 46 is not.
Content
Duo-tone
Left: the app tries lighter and darker text until it is easy to read. Right: plain white, which fails on light and mid-tone colours.
Switching theme used to repaint every surface at once. On a phone in a dark room that looks like a flash and makes the app feel broken. My fix is to take a snapshot of the screen as it looks right now, swap the theme underneath, then fade the snapshot away. People see one smooth change, and never half-themed content. The day/night button shows the mode a tap will switch to, like a play and pause button, and re-checks the real state on every tap, which fixed a bug where it stuck after the first tap.
Colour changes underneath; the old frame fades away on top.
Accessibility is not a checklist at the end of the work. It is a small set of rules built into the parts of the app, so a new screen is accessible unless someone goes out of their way to break it.
Texi's library holds texts that read right to left and texts that read left to right, side by side. Some scripts join their letters, some stack them, some have no spaces between words, and long translations stretch every button. The goal was not translation. It was a layout that does not break when the words change.
A screen designed in one language quietly assumes that text is short, left-aligned and sits to the right of its icon. Right-to-left readers find where that breaks first: back buttons point the wrong way, swipes go the wrong direction and spacing sits on the wrong side. Fixing screens one at a time would never end, so the fix had to be a rule.
Every language has 835 translated texts and its own help file, matching the app one to one. Checking was done by hand:
| Check | How | What it catches |
|---|---|---|
| Direction | Open every main flow in each right-to-left language | Icons pointing the wrong way, wrong swipe direction, spacing on the wrong side |
| Length | Run the longest translations through every button and chip | Cut-off labels, broken rows, clipped sheets |
| Script shapes | Test scripts with tall or joined letters in the reader | Clipped letters, cramped lines, missing characters |
| Help | One help file per language, matching the app | Help for screens that do not exist in that language |
| Real phones | Two physically different phones | Spacing and density bugs that emulators hide |
Texi is built for long reading: books, study notes and articles of any length, with no pictures to carry the page. If reading is not comfortable, nothing else matters.
2 paragraphs
It may naturally be asked whether, in proposing to treat of colours, light itself should not first engage our attention: to this we briefly and frankly answer that since so much has already been said on the subject of light.
Nov 13
Infinitely various are the means by which we become acquainted with these general movements and tendencies, now as a simple repulsion, now as an attraction, now as an upsparkling and vanishing light.
Nov 13
here the writer notes
that although he has
sometimes allowed
himself small changes,
to avoid needless
repetition, or to make
the meaning clearer, he
asked of him for having
left out so little.
He was careful on
this point, having once
decided to explain
the whole matter, partly, as
before said, from a wish to
show
fairly with a difficult
subject, and partly
because many passages,
not directly about the
main idea, are still
Plain text has no bold headings, no layout and no images, so spacing, size and typeface do all the work. People read in many scripts and directions, and each needs its own size and line spacing to feel the same. A three-level typography setting I first tried made people hesitate, so it became one simple picker.
A library of tens of thousands of texts is useless if people cannot narrow it quickly. Texi's web app opens straight into the library: anyone can browse, search and filter without signing in. Signing in only unlocks personal areas such as Library and Subscriptions.
71,334 posts
Aragon
A twentieth-century poetry collection exploring themes of passion and revolution, in plain and vivid lines.
French · Roboto
Jun 9 · 41 B
Thomas Gordon
A travel account that records observations of politics, governance and landscape, with detailed notes.
English · Roboto
Jul 9 · 239 B
dian@example.com
Mary Shelley
The novel introduces isolation, discovery, and the stranger he meets in the Arctic, whose tragic tale warns of defying nature.
English · Roboto
Sep 24 · 98.7 B
August Strindberg
A collection of sketches that depicts society and customs at the turn of the century through various character studies.
Swedish · Roboto
Sep 16 · 429 B
4 subscriptions
dian@example.com
Subscribed 2026-11-11
View PostsSubscribed 2026-06-22
View PostsSubscribed 2025-09-27
View PostsSubscribed 2025-09-27
View PostsFor the web app's Explore page I designed several layouts, labelled A to D, for the side columns and the filters. I compared them on three questions: does the library stay the main thing, can filters be reached without scrolling, and does the layout follow Google's guidelines instead of fighting them? I chose D: a slim navigation strip on the left and one floating Filters card. The library stays the widest part of the page, and the Filters card is the only raised element, so it reads as a tool.
When each choice instantly reloads a huge list, the list flickers and jumps while people are still choosing, and once the panel closes nobody can tell what is switched on. So choosing and applying are separate:
7 books
A. N. Author
A short treatise that looks at how light and darkness shape what we see. It joins plain observation with careful thought, and it was written for readers who simply like to wonder why colours look the way they do. Every chapter starts from something you can try yourself.
English · Roboto
M. Writer
A tale of ambition and consequence, told through letters and a long journey north. It follows one person who tries to master something far too large, and the stranger he meets along the way, whose story is a warning about reaching too far without care for what follows.
English · Roboto
Most of an app is not its big screens. It is the many small moments in between: confirming, waiting, leaving, picking. I replaced one-off solutions with a few patterns used everywhere, so the app feels made by one hand.
Confirmations were plain alert boxes, long actions finished with no clear sign of success, and leaving an editor offered different buttons each time. Each was fine alone. Together they made the app feel inconsistent.
7 books
A. N. Author
A short treatise that looks at how light and darkness shape what we see. It joins plain observation with careful thought, and it was written for readers who simply like to wonder why colours look the way they do. Every chapter starts from something you can try yourself.
English · Roboto
M. Writer
A tale of ambition and consequence, told through letters and a long journey north. It follows one person who tries to master something far too large, and the stranger he meets along the way, whose story is a warning about reaching too far without care for what follows.
English · Roboto
Sort by
Order
4 quotes
Infinitely various are the means by which we become acquainted with these general movements and tendencies: now as a simple repulsion, now as an attraction, now as an upsparkling and vanishing light, now as a gentle glow in the air. Always, uniting or separating, the great purpose is found to be to excite and promote existence in some form or other.
It may naturally be asked whether, in proposing to treat of colours, light itself should not first engage our attention: to this we briefly and frankly answer that since so much has already been said on the subject of light, it can hardly be desirable to multiply repetitions by again going over the same ground.
Reading mode
Appearance
Actions
Theme
View
Infinitely various are the means by which we become acquainted with these general movements and tendencies.
It may naturally be asked whether, in proposing to treat of colours, light itself should not first engage our attention.
Most apps guide attention with likes, rankings and recommendations. Texi's position is that these distort what people read and write: a like biases a reader before they start, and a view counter pushes a writer toward what is popular. Without them, the interface has to help people find and enjoy texts honestly. Every rule became a design decision:
| Left out | Why | What the interface does instead |
|---|---|---|
| Likes, ratings, rankings | They bias a reader before reading | Cards show only title, author and summary |
| Trending and suggestions | They favour some texts and need tracking of behaviour | The feed is in a random order that stays the same while you scroll, so every text has an equal chance |
| Tracking | Readers are not data | Filter choices and saved results stay on the device |
| Referral rewards | Sharing should come from wanting to share | An invitation is a card the person designs, not a points scheme |
| Images | Attention should stay on the written word | Hierarchy comes from type and colour only |
The statistics page describes the library (totals, publishers and languages), never what people do. The result is that absence is the style: no badges, no counters, no popularity cues, and every text card has the same shape, so nothing looks more important than anything else.
A shipped design that fails real use is information. Along the way I reversed or reworked at least eleven decisions. The pattern is the useful part:
Each change was triggered by a specific visual or usability problem and fixed quickly, in the real product.
A short list of settings plus something that draws the result scales. A catalogue of ready-made pictures does not. That choice sits behind both the editor and the themes.
Because I work directly in the app with my engineer, there is no hand-off gap between design and build. Fixes happen in one place, in one loop.
A unified system carries its own upkeep. The shared catalogue had to be pruned to stay small, because options added over time quietly turn a system back into a pile.
Next: bring the same system to the Texi web app, using the same colours and settings as the Android app.
Scope: this page is a qualitative account of design work. No usage data or download numbers are claimed.
If a term or a decision on this page was unclear, it is probably answered here. Tap a question to open it.
Texi is a reading and writing app for plain text. It holds tens of thousands of free ebooks, lets people make quote cards from text they like, and has a reader built for long texts in any language. The feed has no images, no likes and no tracking, so the design (type, colour, spacing) has to carry all the personality.
One case study of how I designed Texi, from the problem to the details, in the order the work happened. The numbers come from the shipping Android app, and the interactive demos are simplified illustrations, not production screens.
A small team: me as the only designer and one engineer. We decide together on anything that depends on data, such as what can be filtered and how it is labelled.
The product’s position is that attention should stay on the written word. Without pictures, hierarchy has to come from type size, weight, spacing and colour. In this project that is treated as the brief, not as a limit to work around: if something can be a colour and a line, it is not an image.
A like or a counter biases a reader before reading and pushes writers toward what is popular. So Texi leaves out likes, comments, view counts, follower counts, rankings, ratings, suggestions, referral rewards, tracking, trending lists and images. Each rule became a design decision, shown in the table in What it leaves out.
It is the accepted minimum difference in brightness between text and the colour behind it, so text stays readable. Because people can choose any card colour, I cannot pick text colours by hand. The app tries lighter and darker text colours until the difference reaches 4.5 to 1, so any colour a person picks stays readable.
Some scripts are written and read from right to left, so the whole screen has to mirror. Texi shows right-to-left and left-to-right texts side by side. A layout built for one direction quietly breaks for the other: back buttons, swipes and spacing end up on the wrong side unless the layout is built for both from the start.
A third “Cancel” button made people hesitate about what would happen. With two choices the outcome is clear. This is one example of a small decision made once and reused across the app.
With tens of thousands of texts, reloading the list on every tap makes it flicker while someone is still choosing. Choices stay a draft until Apply is pressed, and what is applied then shows as removable tags above the results. People can always see what is active and remove it with one tap. The same pattern is used on three screens.
At least eleven shipped designs were reversed or redone, such as retuned palettes, replaced icons, removed gradient washes and a simplified font picker. Each change followed real use on real phones, so I treat a reversal as the process working. The figures come from the shipping Android app.
No. Texi began on Android, and the same system now extends to a wide-screen web app, where navigation becomes a slim strip and filters float in one card. The approach does not depend on a device: start with the person, build the look from a few rules, and let the layout adapt to the screen in hand.
The page you are reading is a design project too. I art-directed it myself, one instruction at a time, and judged every result with my own eyes. This chapter shows how that worked, what I decided, and where the creative and technical choices are.
I wanted a single page that shows how I think, not a pile of screenshots. The rules I set were simple: tell one complete case study instead of many small ones, write so that a person outside design can follow, show real decisions, and let a visitor try the ideas instead of only reading about them.
I built this page by writing instructions and reviewing the result, the way an art director works with a team. I did not hand over a finished brief. I gave one clear direction, looked at what came back, and answered with the next one. The skill is in the directions: what to keep, what to remove, and when something simply feels wrong.
One request in plain words, for example "redesign the table of contents, it feels heavy" or "make the personas horizontal cards".
I open the result on a phone and on a desktop, in day and night, and look for what is crowded, dark, too big or unclear.
I point at the exact thing, often with a screenshot: "these texts overlap", "these images look darker than the others", "this icon is damaged".
Every change is published at once, so the link always shows the latest page and nothing waits in a draft.
| My direction | What changed |
|---|---|
| Rewrite my design philosophy in my own voice, for a reader who is older and not comfortable with technology. | The philosophy became four plain cards that start from the person, not from design theory. |
| The table of contents is annoying. Redesign it with a standard web pattern. | A calm sidebar, like documentation, replaced the busy list. |
| On a phone, make the top bar follow Google's Material 3 standard. | A top app bar with a menu drawer that slides in from the side. |
| Judge this page as an outside critic would, then fix it. | Ten small case studies became one full case study, jargon became plain description, and a Questions and answers section was added. |
| Do not close the search when I click a result, because there is no way to remove the highlight. | Searched words stay highlighted, a Clear button removes them, and arrows move between results with a running count. |
| Redraw the app screens in your own version, very close to my images, with day and night. | Sixteen app screens drawn as illustrations that follow the page theme. |
| The pictures look darker than the others. | The dim layer behind panels was removed, and each panel now stands out with a soft shadow. |
| Show who I designed for as personas. Ask me questions and use my answers. | Three illustrated readers, a student, a novel lover and a professor, each with what Texi did for them. They sit in horizontal cards. |
| Every project needs a team section. | A short chapter at the start names the two people who built Texi and what each one owns. |
| Skills and contact are not main titles. Remove them from the menu. | They became sub parts of About me, and the menu is shorter and calmer. |
| Remove the numbers from the menu, and the line under the titles. | Cleaner type, with nothing extra around the words. |
| On small phones the search is missing its arrows and its close button. | The page width now fits any phone, so the count, the arrows and the X always show. |
| On a phone the top bar does not show my job title. | The title now sits under my name, and the large gap above the first screen was closed. |
| Make every card horizontal. | Process steps, principles, team and personas became wide rows with the title on the left and the text on the right. |
The first version was documentation: ten separate case studies with a lot of terms. I asked for a harsh outside review of it. The review said the page explained a lot and showed little proof, and it was hard for a non-designer to follow. So the work went in four passes:
I also removed things that looked impressive but did not help the reader: a paged slideshow, a second language layer, and photo placeholders.
Texi's idea is quiet reading, so the page had to feel quiet too. I chose a warm paper background, dark ink for text, and one strong accent colour, so the eye always knows where to go next. Big serif chapter titles give the page a book-like rhythm, and a clean sans-serif keeps the body easy to read.
The pictures on this page are my own drawings made in code. The sixteen app screens are redrawn from the real app, with the same layouts, in a light and a dark version that switch with the page. The reader portraits are illustrated faces, the icons are simple line shapes drawn to one weight, and even the decorative stack of books on the home screen is built from a few plain shapes. Because they are drawn, they stay sharp at every size and cost almost nothing to load.
Good results came from clear direction: naming exactly what was wrong, keeping what worked, and judging by looking at real screens in both themes. The tools can build quickly, but taste, order and restraint still have to come from the designer. The page also taught me to treat every complaint as a small design brief: a darker picture, an overlapping label or a missing button is a real user problem, and fixing it exactly, then checking it again on a small screen, is what makes the page feel finished.
I am an artist and a technical designer. Everything I put in front of people is something I have drawn, built and tested myself, on phones, on the web and on every screen in between.
On Texi I am the only designer, so I own visual design, UX and art direction from first sketch to release. I set the direction, make the calls and build what I decide, directly in the Android app, following Google's design guidelines (Material 3) and tested on real phones so that what I draw is what people hold.
I picture someone older, with little schooling and little comfort with technology, who could never learn software. They should be able to look at the screen and tell where they are, what each icon does, what to do next and how to do it.
I check colour, standards, sizes and visual polish until the app is pleasant enough that nobody wants to leave. An app should be tasty: its face should draw people in. I use colour for that, but only in measure.
I always start with the big picture, then go into the details and hunt for interactions. I try never to leave a tap without an answer, or at least let it answer back with a small haptic response.
I try to understand the user and make their route through the app easy.
Most designers either hand off static files or work in a narrower front-end role. This work needed a less common mix:
I do not pick colours by eye and hope they pass review. I specify the colour system and its readability check myself: colours chosen by how bright they look, a minimum contrast of 4.5 to 1 for text on any colour, and an automatic search for a readable text colour. Most designers leave that maths to a developer.
I direct the build straight into the live app, so the full process from problem to test runs in one place, with no hand-off gap between designer and developer.
I frame the problem, weigh the options, make the call and carry it through build and testing, explaining the reason at every step.
I find the pattern behind repeated screens and turn it into one component.
I choose colour and type by eye and by rule, so the product feels hand-made and stays readable in every theme and script.
I design layouts that work for both reading directions from the start, instead of patching screen by screen.
I put accessibility into the rules that generate every screen, so nobody has to remember it at the end.
When real use shows a problem, I reverse my own decision and say so.
| Area | What I do | See |
|---|---|---|
| Product and UX design | Find the problem, try options, test them in the real app | The problem, The process |
| Design systems | Turn repeated screens into one reusable set of parts | One tool instead of four |
| Colour and look | Colour systems, soft shapes, depth and motion | Colour that stays readable |
| Languages and reading directions | Layouts that work left to right and right to left, with type chosen for each script | Every language |
| Reading and finding | Comfortable long reading, filters that stay calm | Reading comfortably, Finding things |
| Interaction design | Bottom panels, visible progress, Save or Discard, Surprise me | Small moments |
| Accessibility | Readable contrast, names for screen readers, help kept in step with the app | Colour that stays readable |
| Product principles | Turn a product's limits into clear interface decisions | What it leaves out |
| Building | Work directly in the Android app, in small steps that can be reviewed | Skills & tools |
I direct the visual design and UX in writing: precise descriptions of layout, hierarchy and standards, which an AI coding assistant builds in the app. I review every result on real devices, correct it and ship it. This keeps the decisions mine while moving fast. My engineer owns the data, and we decide together on anything that depends on it, such as filtering, labelling and personalization. I use AI to explore ideas and iterate, never to replace a decision.
| Area | Skills |
|---|---|
| Product & UX | Understanding problems, mapping what people do step by step, interaction and motion design, small animations and gestures, design systems, testing ideas in the real app |
| Visual design | Colour, type for many scripts, icons, spacing and depth |
| Accessibility & languages | Readable contrast, screen-reader support, layouts for left-to-right and right-to-left reading, language checks |
| Building | Working directly in the Android app, shipping in small steps that can be reviewed, turning design into working screens |
Dian SohaLead Product Designer · Art direction, interface systems & product strategy