Brand guidelines · v1.3

Curiosity, explained. Ideas, built.

I learn.I build.I explain.

MOVE YOUR CURSOR · CURIOSITY PICKS ONE DOT
01 The idea

One person. Many directions.

The brand is not a niche. It is a person the audience trusts. Because you are the common denominator, you can move from camera sensors to LLMs to automation without rebuilding anything.

Curiosity→Learning→Building→Explaining
Curiosity, explained.
Ideas, built.

Positioning

I explore how things work, build useful things, and share what I learn.

Short line

I learn. I build. I explain.

Guardrail

Not a diary. Every piece must serve the promise: something explained, or something built.

02 The signature

Pick one dot. Dive in.

Pixels on a sensor. Transistors on a chip. Tokens in a model. Every system is a grid of small things. The brand idea is the moment you choose one dot and dive into it. The blue dot is always the thing in focus.

  1. 01
    The gridThe wider world, a system you can't see at first glance.
  2. 02
    The blue dotThe one question you pick. The only blue on the page.
  3. 03
    The diveZoom in and there's another grid inside. That's a Deep Dive.

HOLD TO DIVE FASTER

Intro & outro

Open every Deep Dive with a 3-second dive into the dot. End by zooming back out.

Loading & transitions

Use the zoom as the transition between sections, on video and on the site.

Everywhere, quietly

A faint dot grid with a single blue point works as background on thumbnails and covers.

04 Colour

Warm. Quiet. One accent.

Three neutrals do the work; blue appears only where attention is earned. Click any swatch to copy its hex.

PAPER 70%
GRAPHITE 18%
ASH 9%

Blue stays around 3%. If everything is blue, nothing is.

Contrast ratios are computed live against WCAG. Ash is decorative only, which is why Stone exists.

05 Typography

Loud. Clear. Precise.

Hierarchy comes from contrast, not subtlety. Anton is the shout and it only does headlines. Work Sans does the explaining. JetBrains Mono labels the data.

Aa

Anton

Display. Headlines, the promise, thumbnail titles. Uppercase only, one weight, never faked bold.

Aa

Work Sans

Text. Body at 400, subheads at 600, interface at 500. Same grotesque family as Anton, but wide and calm, so the contrast does the work.

01

JetBrains Mono

Data. Labels, episode numbers, timestamps, specs. Small, spaced, capitals.

WordmarkOutlines, never retyped
1 · DisplayAnton · caps · 96 / .95How camera sensors actually work
2 · HeadlineAnton · caps · 52 / 1What a photon does when it lands
3 · SubheadWork Sans 600 · 26 / 1.25A sensor is a grid of tiny light buckets.
4 · BodyWork Sans 400 · 17 / 1.65Each bucket counts the photons that land on it, and everything else, colour, detail, noise, is clever maths on top of that count.
5 · LabelJetBrains Mono 500 · 12 · capsDeep Dive #01 · 12:40 · Camera
  • One display line per screen is the loudest thing
  • Jump sizes on purpose: 96, 52, 26, 17
  • Body in Work Sans 400 at 16px or larger
  • Anton always uppercase, tracking at most +1%
  • Anton for paragraphs or small text
  • Faux bold or italics (Anton has one weight)
  • A fourth typeface
  • Two display lines competing on one screen
06 Motion

Decisive start. Soft landing.

Everything moves like a lens focusing: fast at first, then settling with no bounce. Never linear, never playful. One curve for the whole brand.

Linear
Default ease
Brand ease
cubic-bezier(.16, 1, .3, 1)The brand curve (an expo-out). Use it for everything.
240 · 480 · 960 msUI feedback · reveals and cards · big moves like the dive.
No bounce. No spin.Fade up, scale, and zoom. Nothing wobbles.
07 Series

One name. Many series.

Everything is I AM JUBAYER first. A series is the same name, a slash, and one or two words, set as one piece of lettering. The dot lands once, at the very end.

The series lockup

Name, ash slash, series, one blue full stop. Always Anton, always one line, always the same cap height. Series lockups use the bold lettering whichever wordmark you pick above.

Slash in ash

It separates, it never shouts. The only colour in the lockup is the dot.

One full stop

The dot comes once, after the series. Never after JUBAYER when a series follows.

Short and capital

One or two words, same size as the name. Never a smaller second line.

The master brand. Website, portfolio, thoughts, experiments, business journey.

Science and technology explainers. Centre dot: zoom into the thing.

  • #01 How Camera Sensors Actually Work
  • #02 How an LLM Works
  • #03 How Semiconductors Are Made

Websites, AI tools, automation and experiments. Bottom-left dot: building up from the ground.

  • I built an AI automation system

Creative and commercial work. Top-right dot: looking outward, to clients.

Articles, research, ideas and the newsletter. Top-left dot: where reading starts.

01 · AUDIENCEI AM JUBAYERA person people trust
02 · ATTENTIONContentDeep Dives, builds, notes
03 · OWNEDWebsite + emailSearch traffic and a list
04 · REVENUETools & productsProjects become assets
08 Thumbnail studio

Face. Type. One dot.

A working template. Every thumbnail has a big headline, a mono kicker, a faint grid with one blue dot, and your face on the right. Change the text, add your photo, then download a 1280×720 PNG. Your photo stays in your browser.

Max ~6 words. One blue detail. Face right, wordmark bottom-left.

Series
Theme
09 Website

A home, not a portfolio.

IamJubayer.com should feel as relevant in ten years as it does today: calm, spacious, organised around what you actually do. The dot grid glows quietly behind the name.

HOMEPAGE · LIGHT & DARK
iamjubayer.com
  • Deep Dives
  • Building
  • Writing
  • About

I learn. I build. I explain.

Deep Dives
Science, technology & fascinating ideas.

How things actually work.

What I’m Building
Projects, experiments & businesses.

Built in public.

Writing
Ideas worth thinking about.

Notes and the newsletter.

10 Voice

Curious, clear, calm.

Write like a smart friend explaining something over coffee. Explain the mechanism, show the build, admit what you don't know yet.

+ Sounds like
A camera sensor is millions of tiny buckets catching light.
I built it. Here is what broke first.
I don't fully understand this yet. Let's work it out.
× Never sounds like
This ONE trick will change everything!
Revolutionary, game-changing AI synergy.
Here's what I had for lunch.
  • Explain simply, then go deeper
  • Show the build, including what failed
  • Short sentences, concrete examples
  • Say “I learned” more than “you must”
  • Guru or get-rich energy
  • Posting everything you happen to do
  • Buzzwords instead of mechanisms
  • Reinventing the look for every project
Copied
← iamjubayer.com