Foundations
Frames and space: four aspect ratios, one spacing scale, no radius, no shadow.
- Heroes and title cards in
frame-scope (2.39:1); video in frame-wide (16:9); posters in frame-poster (2:3); portraits and posts in frame-portrait (4:5).
- Space on
space-1 to space-10 (4 to 128px); bands apart by section-gap.
- Every corner is
radius-0.
The lāzaward rule: the blue marks what has been made clear, and nothing else.
- Yes: links (
accent), the focus ring (focus), the mark’s point and the harakat (point), one drench band per page.
- No: a filled button, a filled tab or selected state, a glow, a gradient.
- A selected state is an ink underline plus the point.
The two surfaces: Cinema (kohl) for what we show and Reading (gypsum) for what we explain, with every text role measured live.
- Put
canvas behind a band and set text in text, text-2 or text-3.
accent is for links only; focus is the 2px ring; point is the mark’s point and the harakat.
- Every role here holds at least 5.4:1 on its canvas in both themes.
Type in both scripts: Kufam for titles, labels and the name; Noto Serif and Noto Naskh Arabic for reading.
- Arabic sits 1.12 times the Latin beside it, line height 1.4 in display and 1.8 in text, never tracked.
- No Arabic running copy appears here until a native writer provides it; the specimen shows the name and the letters.
font-synthesis: none: no faked bold or italic.
Identity
The dots decide: without its dots, نبين is the skeleton ٮٮٮں, shared with بنين and يبين.
- Use it to explain the name and the point to anyone: the dots decide which word you are reading, and the point in the mark does the same job for ن.
- The dots are lāzaward here to show the idea. In the approved lockup the harakat take lāzaward and the dots keep the letter colour.
- Signed off by a native reader on 8 November 2026.
The name lockup: the mark, NUBAYIN and نُبَيِّن at equal weight, a sketch in Kufam until the wordmark is drawn.
- The Latin cap height is set to the right page’s outer edge, 12.5 units of the mark; the card measures Kufam live and sets the size.
- The Arabic is 1.12 times the Latin; its harakat take
point in two colours.
- Gaps: 9 units (the point’s width) after the mark, 4.5 units either side of the 1px
rule hairline.
- It never mirrors: inside a right-to-left page it keeps this order.
- Below 28px the mark switches to Micro and everything takes one colour.
The NUBAYIN mark: ن, the first letter of نُبَيِّن, drawn as an open book with its rhombic point above.
- Provide: nothing but a size. Inline the SVG from
assets/Logos so the pages take currentColor and the point takes point.
- Display (
nubayin-mark.svg) from 28px tall; Micro (nubayin-mark-micro.svg) from 14px to 27px, always one colour.
- Reveal it with pull, then point: the rhombus lands as a hard cut after the pull.
- Never outline, round, rotate, mirror, recolour the pages in lāzaward, or put it in a shape.
The mark’s construction: a 25 × 28 unit box, two slopes, two page heights and one rule for the point.
- Pages are 12 units wide with a 1-unit gutter. Tops and the point run on 5:6, bottoms on 5:8.
- The left page is 18 units tall at the spine, the right page 10. Both outer edges end on one line.
- The point (9 × 7.5) sits with its top on the top line and its right tip on the right edge.
- Redraw nothing by eye: every vertex is on a 2.5-unit grid.
The point: one rhombus cut from the mark, 9 × 7.5 units on the 5:6 slope, used at every scale.
- Eyebrow marker, list bullet, the “now” indicator and the selected state are all this shape in
point.
- A selected tab is an ink underline plus the point. Never a lāzaward fill.
- It is never drawn as a circle.
The reader layer: one switch that shows the second reading of the brand to Arab readers, and stays quiet for everyone else.
- “Everyone” is the default and must read completely on its own.
- “Arab reader” adds short notes beside each element that carries a second reading.
- The switch’s selected state is an ink underline and the point, never a fill.
- Its Arabic label awaits native review, shown by the dotted underline.
Components
Buttons: a solid ink primary and a hairline secondary, with sharp corners, never lāzaward.
- Primary: ink fill (
text) with canvas text; one per screen. Hover dims to text-2.
- Secondary: a 1px
text-3 outline that turns text on hover.
- Focus is the 2px
focus ring at a 3px offset. Minimum height 44px.
- Labels say exactly what happens, in Kufam 500 at 14px.
The credits block: roles in Kufam italic, names in Kufam 500, tabular figures, Arabic at equal weight.
- Real credits only. Each role is one line; names are never abbreviated.
- The Arabic column is written by a native writer and shown at equal weight, never as a subtitle.
- End with the ℗ and © lines.
The eyebrow: the rhombic point and a short uppercase label, above a title.
- Kufam 500 at 12px, +0.12em, in
text-3; the point in point.
- Two to four words. It names the section, never repeats the title.
The field: a label above, a 1px text-3 border, square corners, and messages that say what to do.
- Errors name the fix in
danger with the word “Error”; success in success. Never colour alone.
- The submit button is the primary button. Nothing pre-ticked, no false urgency.
The frame bar: the one strip that never moves, above every title act.
- 44px of
kohl-1000, the Micro mark at 14px and “A NUBAYIN UNIVERSE PRODUCT” in Kufam 500 at 11px, +0.14em, in kohl-300.
- Same height, same words, same place on every act. It never takes an act’s colour.
The language switch: English and العربية, the current one marked with an ink underline and the point.
- Each language is named in itself. The Arabic page sets
lang="ar" dir="rtl" on its root.
- The Arabic label awaits native review (dotted underline).
The bilingual meeting title: English and Arabic meet on one line, Latin, a hairline, Arabic.
- A three-column grid that stacks below 720px, Latin first.
- The Arabic is 1.12 times the Latin, with harakat in
point on the name only.
- Reveal it with pull, then point.
- For a title act, the title meets its own Arabic title, written by the title’s team.
The player: no autoplay, captions and transcript one tap away, straight-cut controls.
- Controls are labelled; the play and pause glyphs are straight cuts on the mark’s grid in
currentColor.
- Captions follow the Subtitles card: Kufam 400,
kohl-50 with a kohl-950 edge, no box.
- Focus is visible on every control. The timeline never mirrors in right-to-left layouts.
Text links: lāzaward text with a 1px underline offset 3px, thickening to 2px on hover.
- Use
accent on both surfaces; accent-strong on hover.
- Links are the main everyday use of lāzaward. Never colour non-link text with it.
The work card: the work’s own key art in its slot, the act’s ground as a 44px band beneath, the studio’s sharp frame around both.
- A Quiet Return shows XPRSHUN’s released cover as released (K8): never cropped, retouched or recoloured, with the artist’s own disclosure in the credit line.
- Real titles only. An empty slot says what is coming without inventing it.
Title acts
The Act builder: drop key art, and it proposes a ground and ink and refuses an act that breaks the rules.
- It samples the image, takes the dominant tone as ground and the strongest light or dark tone as ink.
- It checks ink on ground (4.5:1), distance from
lazaward-600 (at least 0.10 OKLab), and the two banned pairs (gold on black, green with gold).
- The demo runs on environment plates. A plate is not a title; real acts use real key art.
A title act: the title’s own ground, ink and type, under the frame bar that never moves.
- Build the act with the Act builder rules: ink 4.5:1 on ground; ground at least 0.10 OKLab from
lazaward-600; the title’s own type or Kufam.
- A Quiet Return renders in XPRSHUN’s own system: ground
#596B7B, paper ink #F4EFE6 (4.81:1), Newsreader Italic.
- The act ends where the studio’s footer begins; no act colour leaks into it.
Motion
Pull, then point: the studio’s one gesture, on screen and in film.
- Wrap what is revealed in
.nb-reveal; mark its lāzaward parts .nb-point.
- The pull animates
filter and opacity only, over dur-reveal (700ms on a hero) with ease-reveal, once.
- On
animationend, .is-clear shows the points as a hard cut: no fade, no scale.
- Under reduced motion the final frame is simply there.
The studio ident: 2.6 seconds before every NUBAYIN film, the pull and then the point, rendered from the mark’s exact geometry.
- Picture: soft with no point for 1.1s, a 700ms pull to sharp, the point lands as a hard cut at 1.95s, cut at 2.6s.
- Sound: five to seven singers meeting in unison, then a piece of lapis set down on slate, recorded by real people. The picture file ships silent until that recording exists.
- Files: 1920 × 1080 and 2048 × 858 (scope), in the repository’s video folder.
Imagery
Motion plates: eight-second AI-generated environments for heroes, title acts, social and transitions. Silent, no people.
- Hover, focus or tap a plate to play it; nothing plays with sound, and nothing plays under reduced motion.
- “Breakfast, pull then point” performs the studio’s gesture in a real place: the last thing to come sharp is a small blue tea glass.
- Made with Gemini Omni through the Interactions API; audio stripped. Prompts are in the repository’s video register.
The plates: AI-generated environments that stand in until real stills exist, now in true colour with traces of life and no people.
- Series 2 (life without faces) leads. Series 1 keeps the materials and places that still earn their place.
- Retired on 8 November: the grove and the wadi (rendered), the stage and the light table (stock props).
- Disclose plates once per surface, in the credit line. Prompts, model and date are in the repository’s register.
Stills: the frames real photographs will fill, and how to shoot them.
- Real people in real light, faces readable, the light from a window, the sky or a practical lamp.
- Credit and consent for every person. Caption: “Photograph: Name Surname, City, Year.”
- Never a silhouette against light, never a person generated by AI.
Label
On an artist’s video (K9): the artist’s own sound leads wherever the artist’s system puts it, and NUBAYIN appears only as the label strip at the foot of the artist’s end card, silent.
- XPRSHUN long-form: the whisper and the wordmark open; the song starts 0.5s after the whisper ends; NUBAYIN’s strip sits at the foot of the end card.
- XPRSHUN shorts: the first second belongs to the song; the whisper plays over the end card, which holds for at least 1.6s, with NUBAYIN’s strip at its foot.
- The sung studio ident opens only films NUBAYIN produces. It never plays on an artist’s video, and NUBAYIN’s sound never plays over an artist’s music.
- Song 1 frames are XPRSHUN’s own (an AI plate, no people). The end card is drawn in XPRSHUN’s Dusk theme.
The catalogue (K9): one number for every work, whatever the medium.
- A release drawn from a work takes the work’s number and its track number: A Quiet Return is NBY 001, and its single from track 7 is NBY 001.7.
- A number is never reused, and a work keeps its number in every format. The catalogue starts with Chapter I; the three earlier singles take no number.
- It is how Factory and Criterion made work that looks nothing alike read as one collection. It fills the catalogue field on Discogs and MusicBrainz and the spine of anything physical.
- On NUBAYIN’s surfaces the number is set in Kufam. On the artist’s release it sits in the label strip, in the artist’s ink.
The label: three layers. The studio keeps the frame, each artist keeps their own world, and every work carries NUBAYIN’s credit at the foot.
- Approved on 8 November 2026 (K8): NUBAYIN owns or licenses XPRSHUN’s recordings and is the label. Rules that protect people bind everyone on the label; NUBAYIN’s style and voice rules bind only NUBAYIN’s own surfaces; an artist’s released work appears as released.
- The religious-text ruling governs the studio’s own voice. Artists’ lyrics and covers follow the artist.
- Approved on 8 November 2026 (K9): the line for a person, the catalogue, the order on video, the house edition and an Artists page.
The label strip: where NUBAYIN and a release physically touch, at its foot.
- The Micro mark at 14px (4mm in print), “℗ 2026 NUBAYIN Studio” and the catalogue number (K9), in the release’s own ink.
- NUBAYIN owns or licenses XPRSHUN’s recordings (K8), so NUBAYIN Studio is the label name on every release and in every database. The song credit stays the artist’s: “Words and music by XPRSHUN. © 2026 XPRSHUN. All rights reserved.”
- On XPRSHUN it takes XPRSHUN’s paper and ink. NUBAYIN’s colours never enter the release.
Touchpoints
The partner deck cover, 1920 × 1080: the type column holds still on kohl and the picture brings the colour.
- Lockup, the deck’s eyebrow, the house line open at 168px, and نُبَيِّن at 96px with lāzaward harakat.
- The sea supplies the only saturated colour; the type column stays kohl.
- “Prepared with Barakah Agency” and the plate disclosure share the credit line.
A deck spread, 1920 × 1080, on the reading surface: one idea, said plainly, beside one warm image.
- Title in
title or larger, three short points with the rhombic bullet, a 4:5 still or plate.
- Disclose a plate in the caption line, never on the picture.
End cards: the studio card that closes every film, and the credits template, at 2.39:1.
- The studio card: the mark, “A NUBAYIN UNIVERSE PRODUCT”, nubayin.studio and the ℗ and © line.
- The credits roll: roles in Kufam italic, names in Kufam 500, tabular figures, centred on the hairline. Arabic credits at equal weight, written by a native writer.
- Keep everything inside the 90% title-safe area.
The studio one-sheet, A4 portrait: who NUBAYIN is, on one page, for festivals and partners.
- The rooftop cinema as the hero at 2.39:1, the meeting title (house line left open), three short columns.
- The plate is disclosed in the credit line; contacts are set by the studio.
The film poster template, 27 × 40 in: key art in the top two-thirds, the title in the bottom third, the billing block, and the endorsement strip at the foot.
- The single rhombic point stands before “A film by”. The title is Kufam 400 at 128px.
- Key art and title follow the title’s act; the foot strip stays the studio’s.
- Laurels only for real selections. The key art here is a labelled plate and the names are placeholders.
The press kit, A4 landscape: a cover and a stills sheet with a caption and a credit under every frame.
- Press stills are real photographs. Here the frames hold plates and say so once in the caption line; plates are never sent to press.
- Every still: title, place, year and “Photograph: Name Surname”.
The social set at true proportions: avatar, 4:5 post, story, share image and YouTube banner, with safe areas drawn.
- One image or one title per post. Type sits on a kohl band, never on a gradient or over a face.
- Alone on a plain surface the line is “Show the work first.”; beside an image it may be the open house line.
- Story text stays inside x 150–930, y 285–1248. The YouTube banner keeps everything inside the central 1235 × 338.
Letterhead and email signature on the reading surface.
- Letterhead: A4, 20mm margins, the mark and name at the head, Noto Serif at 11pt in one column, nubayin.studio at the foot.
- Signature: the person’s name, their role, the Micro mark and the site. No images of people, no quotes, no banners.
Subtitles and captions: Kufam 400 in kohl-50 with a thin kohl-950 edge, no box, in the bottom tenth of the frame.
- About 5% of frame height per line (48 to 54px at 1080). Two lines at most, centred.
- Arabic subtitles in Noto Naskh Arabic at 1.12 times the Latin size, written by a native writer.
- Sound descriptions in square brackets.
The title page on nubayin.studio, at 1440 × 900 and 390 × 844: studio navigation, the frame bar, the title’s act, then credits on the reading surface.
- The act fills the page in the title’s own system; the navigation, frame bar and credits stay the studio’s.
- On phones everything stacks; the frame bar keeps its 44px.
- Real content: A Quiet Return by XPRSHUN.
Showcase
The homepage hero: the work moving first, then the name, revealed with pull, then point.
- A motion plate fills a 2.39:1 frame under the navigation; it plays muted and stops for reduced motion.
- NUBAYIN in Kufam 400 at 128px, نُبَيِّن at 143px (1.12 times), and the house line “We make clear” in Noto Serif at 22px, left open.
- The harakat are the only lāzaward on the page, and they land after the pull.
- The plate is disclosed once, in the credit line.
A two-slide carousel where the swipe finishes the house line: “We make clear”, then “so faces are lit.”
- Slide one: a plate or still, the open line on a kohl band. Slide two: a real photograph of a face, lit, and the line that completes it, with a full stop because the sequence ends there.
- 1080 × 1350 each. Type sits on a band, never on the picture.
- Slide two’s frame waits for a real photograph; it is never generated.