Current App concept
A visual-direction reference for the consumer App — not a template to copy literally across every screen.
Brand & Visual Direction
The Kidzy experience should feel playful, clear and professional — from the first glance.
The visual language starts from the real logo: turquoise leads, while orange, green and magenta act as controlled accents. The consumer App stays rich and discovery-led; Checkout and Admin become calmer and more functionally dense.
Arabic-first · RTL
App + Web
APP + WEB
The same product, with a layout designed for each screen
We do not stretch a mobile screen across desktop. The App is touch-first, while the Web uses wider space for faster search, broader merchandising and clearer content without losing Kidzy’s identity.
Web storefront interpretation
The same content entities and business truth, composed specifically for the Web.
CategoriesShop by AgeBrandsNew ArrivalsOffersGifts
A world of play starts hereDiscover by age, interest or occasion
RESPONSIVE BEHAVIOR
Responsive does not mean “shrink everything”
Every breakpoint reprioritizes the experience. We do not use 11px text to force content into a screen, and we do not allow oversized headlines to consume the first viewport.
Desktop / Laptop
Prominent search, persistent navigation, controlled content width, varied horizontal sections and more room for comparison and review.
Tablet
A two-column rhythm where useful, with generous touch targets and simplified secondary controls.
Mobile
16px+ body text, 44px+ controls, focused sections and cards that move to one column instead of crushing the text.
VISUAL RULES
Rules that keep Kidzy expressive without becoming chaotic
Image-led first impression
Toys, occasions and product imagery carry the energy. Commercial heroes keep headings short and CTAs clear.
Controlled brand accents
Turquoise is the lead color. Orange, green and magenta are selective celebratory accents, not competing themes.
Make it special
Gift services and Character Delivery receive a distinct module in the right context, using Character imagery only where it supports that service.
Quiet checkout
Decoration recedes at payment. Choices, Delivery Groups, totals and the primary action become the visual center.
Operational admin
Admin does not reuse toy-card grammar. It uses stable tables, clear toolbars, grouped controls and restrained brand accents.
Readable bilingual UI
Arabic and English each get appropriate typography, comfortable line height and direction-aware components rather than forced mirroring.
REAL BRAND ASSETS
Brands are shown as real marks, not text pills
This sample uses the supplied assets. Third-party logos are not recolored, and calm white space keeps the brand itself as the focal point.
CHARACTER DELIVERY ASSET SCOPE
Character imagery appears only where it serves Character Delivery
The supplied images support Character selection, setup and operations — not random decoration across the report or storefront.
DESIGN SYSTEM CHECK
Locked presentation and implementation standards
The report itself follows the same readability principles expected from the product: moderate hierarchy, comfortable body text, low-noise surfaces and genuine white space.
16+
Mobile body text
Primary reading sizes do not drop into uncomfortable territory.
44
Touch targets
Interactive controls provide comfortable tap areas.
AA
Contrast intent
Semantic meaning is not communicated by color alone.
RTL/LTR
Structural
Direction, arrows, navigation and steppers are treated as structural behavior.