Plain-English guide

What UI/UX design actually means

By Youssef Mahmoud Soliman, founder of YMS Studio · Updated

Two abbreviations, one simple idea. UI (user interface) is what your website looks like: the colors, the buttons, the layout, the fonts. UX (user experience) is how it feels to use: how fast someone finds your prices, how many taps it takes to contact you, whether the menu makes sense on a phone.

Why should a founder care? Because visitors judge your business in about five seconds, before they read a single sentence. A dated or confusing site tells them "this company is small, slow, or careless" even when none of that is true. We have watched it happen with our own clients: same firm, same services, completely different results once the site stopped working against them.

UI is the surface. UX is the decision.

Think of a showroom in Mohandiseen. The UI is the lighting, the signage, the way products sit on the shelf. The UX is whether you can find your size and whether anyone tells you the price. A beautiful showroom you cannot buy anything in has failed at UX, not at taste.

A button that looks like a button is UI. A button placed where you were already looking is UX. A designer who only does one half hands you something that photographs well and converts badly. Nielsen Norman Group's ten usability heuristics are thirty years old, and most Egyptian sites still break half of them.

The five seconds before anyone reads a word

Nielsen Norman Group measured how long people stay on a page: the highest risk of leaving is in the first ten seconds, and Egyptian visitors are no more patient. A visitor answers three silent questions: am I in the right place, are these people real, what am I meant to do. Put the plain sentence first: what you do, who for, where.

What good design does for a business

Good UI/UX is not decoration. It answers three questions the moment someone lands: what do you do, why should I trust you, and what should I do next. When those answers are obvious, more visitors call, book, or buy. When they are buried, people leave and you never hear about it.

Every screen we design has one job. A homepage earns the click to your work. A product page earns the add to cart. A contact page removes every excuse not to write. If an element does not help the screen do its job, it goes.

The order of the page is the argument

Layout order is the sequence of an argument. Most business pages in Egypt open with company history, then services, then a contact form at the bottom. That is the order the owner thinks in, not the order the buyer decides in. A buyer wants the claim, then the proof, then the ask: named clients, photographs of real work, numbers. Beef Point sells fresh-cut meat across Cairo and Giza, whose pages show the cut, the delivery zone and the minimum order before asking for anything.

Design for a 375px phone on Egyptian 4G

Most of your traffic is a mid-range Android held in one hand on Vodafone or Orange data. So the design starts at 375px wide and grows from there. At 375px there is room for one idea, one heading, one action, and nothing else survives. Google's Core Web Vitals measure how soon the main content paints and how fast the page answers a tap, and both collapse on a heavy site over a congested cell.

Arabic is a design problem, not a translation problem

Most bilingual sites in Egypt are an English site with Arabic poured into it. You can tell within a second: the navigation still runs left to right, the logo sits in the wrong corner, arrows point the wrong way. Mirroring is the whole job. In right-to-left the layout flips: menus, breadcrumbs, progress steps, sliders, any icon that implies direction, even the side a form label sits on. Padding and margins get written as logical properties so the flip happens once.

Then the typography. Arabic has no capital letters, so hierarchy comes from weight, size and space rather than case. Letters connect and carry marks above and below the line, so Arabic needs more line height than English. The font has to be a real Arabic typeface with a full weight range, not a Latin font with an Arabic fallback behind it. Numerals are a decision too: readers here use both ٠١٢٣ and 0123, but prices and dates should stay in one system across the site.

The last part is the writing. Machine-translated Arabic reads as machine-translated Arabic to anyone who speaks it, and it costs you the credibility the English side earned. Brand names stay in Latin script: Google, Shopify, Fawry, Paymob, InstaPay, WhatsApp. We built IGBS, Egypt's largest trademark firm, in five languages with full Arabic RTL, and Al Badawi's bilingual storefront ships handmade leather worldwide. In both, the Arabic was designed alongside the English.

Arabic added at the end is a translation. Arabic designed from the start is a second site that happens to share a codebase.

Forms people actually finish

Every field you add costs you enquiries. Ask only for what you need to reply: a name, one contact method, one line about the problem. Accept an Egyptian mobile the way people write it, eleven digits starting 010, 011, 012 or 015, and do not reject a leading +20. Offer WhatsApp too: plenty of Egyptian buyers will never fill in a form but will message in seconds. Interaction to Next Paint catches a submit button that feels dead on a mid-range phone.

Where visitors give up, and how to watch it happen

Arguments about design are guesses. Recordings are not. Microsoft Clarity is free and shows you three things worth arguing about. Rage clicks: someone tapping the same element repeatedly because it looks tappable and is not. Dead clicks: taps on a heading or an image a visitor assumed was a link. Scroll depth: the exact percentage where people stop. Filter the recordings to mobile, in Arabic, on people who did not convert, and you will stop guessing about what the search traffic wanted.

How we work

We design around how your customers decide, not around trends. That starts with understanding what you sell and who buys it, then sketching the path from first visit to closed deal. Design and code sit with the same team here, so nothing gets lost between a pretty mockup and the real site.

Frequently asked questions

What is the difference between UI and UX?

UI is what the page looks like: layout, colour, type, buttons. UX is what happens when someone uses it: how quickly they find the price, whether the Arabic version behaves. A page can be attractive and unusable. The ones that earn money are designed for both.

Why does my website get visitors but no enquiries?

Usually the order, not the design. The ask is in the wrong place, or buried where nobody reaches it. Clarity's scroll depth and rage clicks will normally show you the exact screen where people stop. That is a smaller job than a full redesign.

Do you design the Arabic version separately?

We design both together. The layout mirrors, the typeface changes, the line height changes, and the copy is written by a person. IGBS runs in five languages with full Arabic RTL. If a studio offers Arabic as an add-on at the end, that is exactly what you will get.

How narrow should a website be designed for?

375 pixels. That is the smallest phone still in regular use in Egypt. If a page holds together there it holds together everywhere. Design that screen first, then let the layout expand. The other way round gives you a desktop site with a squashed mobile version.

Does design affect Google rankings?

Indirectly, and more than people expect. Google measures how fast the main content appears and how quickly the page answers a tap, and heavy decorative design fails both on a 4G connection. Good design and a site built to be found in Egypt are the same project, not two.

Want a site that pulls its weight?

Send us the problem you are trying to solve. We will tell you honestly whether we are the right team to build it.