From Sketchbook to Screen: My Design Process

Every project starts the same way for me: with a blank page. Not a blank canvas in Figma, not an empty code editor — just an actual sketchbook. There’s something about pencil and paper that removes pressure. It allows ideas to be messy, unfinished, and free from grids or constraints.
When I’m sketching, I’m not thinking about pixels or responsiveness yet. I’m thinking about flow — how someone’s eyes will move across the page, where their attention will land first, and how I can tell a story through design. These are ugly little scribbles, but they carry the seeds of what comes later.
From there, I move into digital. I use Figma to translate those messy sketches into something structured. This is where I experiment with grids, typography, and hierarchy. Sometimes the layout clicks immediately; other times, I’ll try dozens of variations before I land on one that feels right. The digital stage is where my sketchbook ideas either evolve or get thrown away.
Only after I’ve nailed the design do I start coding. As a creative developer, this is my favorite part: breathing life into static layouts. It’s where I get to experiment with interactions, animations, and micro-details that bring out personality. A simple hover, a smooth transition, or a scroll-based effect can turn a design into an experience.
Of course, the process isn’t strictly linear. I often circle back — sketching again mid-project, adjusting designs while coding, or prototyping new ideas directly in Framer. Creativity isn’t a straight road; it’s more like a loop that gradually tightens until the final result emerges.
One thing I’ve learned is that rushing kills creativity. Every stage of the process has its own rhythm. Sketching is fast and messy. Designing is slower and more deliberate. Coding is meticulous and precise. Balancing these tempos is what makes the final product feel both inspired and polished.
At the end of the day, what matters most is not the tools or the order of steps, but the mindset. Every project is an opportunity to experiment, to blend imagination with discipline, and to create something that feels alive.
That’s why I’ll never abandon my sketchbook. Because no matter how advanced the tools get, the best ideas usually start with a quick, imperfect line on paper.
More from my journal
From Sketchbook to Screen: My Design Process

Every project starts the same way for me: with a blank page. Not a blank canvas in Figma, not an empty code editor — just an actual sketchbook. There’s something about pencil and paper that removes pressure. It allows ideas to be messy, unfinished, and free from grids or constraints.
When I’m sketching, I’m not thinking about pixels or responsiveness yet. I’m thinking about flow — how someone’s eyes will move across the page, where their attention will land first, and how I can tell a story through design. These are ugly little scribbles, but they carry the seeds of what comes later.
From there, I move into digital. I use Figma to translate those messy sketches into something structured. This is where I experiment with grids, typography, and hierarchy. Sometimes the layout clicks immediately; other times, I’ll try dozens of variations before I land on one that feels right. The digital stage is where my sketchbook ideas either evolve or get thrown away.
Only after I’ve nailed the design do I start coding. As a creative developer, this is my favorite part: breathing life into static layouts. It’s where I get to experiment with interactions, animations, and micro-details that bring out personality. A simple hover, a smooth transition, or a scroll-based effect can turn a design into an experience.
Of course, the process isn’t strictly linear. I often circle back — sketching again mid-project, adjusting designs while coding, or prototyping new ideas directly in Framer. Creativity isn’t a straight road; it’s more like a loop that gradually tightens until the final result emerges.
One thing I’ve learned is that rushing kills creativity. Every stage of the process has its own rhythm. Sketching is fast and messy. Designing is slower and more deliberate. Coding is meticulous and precise. Balancing these tempos is what makes the final product feel both inspired and polished.
At the end of the day, what matters most is not the tools or the order of steps, but the mindset. Every project is an opportunity to experiment, to blend imagination with discipline, and to create something that feels alive.
That’s why I’ll never abandon my sketchbook. Because no matter how advanced the tools get, the best ideas usually start with a quick, imperfect line on paper.