Our Generation Font: A Designer’s Web Layout Test
I was halfway through a redesign for a boutique lifestyle coaching website when I hit that familiar wall. The layout was clean, the color palette was warm and inviting, but the typography felt cold. The client wanted a brand identity that felt approachable, human, and authentic, yet the standard sans serif headers I had chosen were doing all the heavy lifting without adding any personality. That is when I decided to test Our Generation, a handwritten font from Script Amp, to see if it could bridge the gap between professional structure and friendly warmth.
As a web designer, I am always cautious with script and handwritten typefaces. They can easily become illegible on mobile devices or clash with body copy if not paired correctly. However, Our Generation promised to be simple, natural, and adaptable. I needed a typeface that would work not just as a decorative element, but as a functional part of the user interface. Here is how this font performed in a real-world digital product context.
First Impressions in the Hero Section
The first place I applied Our Generation was the hero section headline. In modern web design, the hero area is critical for establishing tone within seconds. I replaced a bold, geometric header with this handwritten font to introduce a sense of intimacy. The result was immediate. The letters have a casual, organic flow that mimics natural handwriting without being messy or overly stylized. This made the headline feel like a personal note rather than a corporate announcement.
What stood out during this initial test was the balance between character and clarity. Many creative fonts sacrifice readability for style, but Our Generation maintains distinct letterforms. This is crucial for scanning behavior. Users do not read every word on a landing page; they scan for cues. A handwritten font that is too complex forces the brain to work harder to decode the message, which increases bounce rates. With this font, the message remained instant and clear, supporting better user engagement right from the top of the fold.
Readability and Mobile Responsiveness
One of my primary concerns was how the font would render on smaller screens. Responsive layouts often break delicate typography, making thin strokes disappear or causing letters to collide. I tested the font across various breakpoints, from large desktop monitors down to mobile phones. Our Generation held up surprisingly well. Its stroke weight is consistent enough to remain visible on high-resolution retina displays, yet it does not become blobby when scaled down.
For mobile users, I adjusted the line height and letter spacing slightly to ensure the handwritten style did not feel cramped. This is a standard practice when using any display font or script font in a digital environment. By giving the letters room to breathe, the text retained its friendly mood without sacrificing legibility. For buttons and call-to-action areas, I used the font sparingly. Short phrases like "Join Us" or "Get Started" looked charming and inviting, encouraging clicks without looking informal to the point of unprofessionalism.
Strategic Font Pairing for Digital Brands
A handwritten font rarely works in isolation. To build a cohesive brand identity, you need a strong supporting cast. I paired Our Generation with a clean, neutral sans serif font for the body copy. This contrast is essential in UI design. The simplicity of the sans serif allows the personality of the handwritten header to shine without creating visual noise. If I had paired it with another decorative font or a heavy serif font, the design would have felt cluttered and difficult to navigate.
This pairing strategy worked particularly well for the blog section of the site. The headers used Our Generation to add a touch of editorial design flair, while the article text remained in a highly readable sans serif. This hierarchy guides the eye naturally, helping users distinguish between navigation elements, headlines, and long-form content. It creates a polished online brand experience that feels curated rather than chaotic.
Versatility Across Digital Touchpoints
Beyond the website itself, I explored how this typeface could extend into other digital assets. For social media graphics, the font added a consistent voice to Instagram stories and Pinterest pins. It is adaptable enough to work over image banners, provided there is sufficient contrast. I found that using it on light backgrounds with dark text offered the best readability, though it also performed well on dark backgrounds when the weight was adjusted appropriately.
For a course sales page I was concurrently working on, I used Our Generation for testimonial quotes. This application leveraged the font’s natural and friendly characteristics to make the feedback feel more personal and trustworthy. In logo design contexts, this font could serve as a memorable mark for small businesses, such as bakeries, craft studios, or wellness coaches, where a human touch is a key selling point. It avoids the rigidness of corporate branding, offering a more approachable alternative.
Licensing and Technical Considerations
Before finalizing any font choice for a client project, technical due diligence is non-negotiable. When selecting Fonts from Script Amp, I always check the included styles and file formats. Our Generation comes as a premium font with webfont availability, which is essential for fast-loading visual content. Slow-loading custom fonts can hurt SEO and user experience, so ensuring the file size is optimized is part of the process.
I also reviewed the commercial font licensing terms to ensure it covered web usage, digital ads, and potential packaging design if the brand expanded into physical products. Multilingual support is another factor I check, although for this specific English-language project, the standard character set was sufficient. Knowing that the font is cleared for commercial use gives peace of mind when delivering final design assets to clients.
Final Verdict on Visual Hierarchy
Integrating Our Generation into the project transformed the site’s emotional resonance. It did not just look good; it functioned well within the constraints of modern web usability. It proved that a handwritten font can be both cute and professional if used with intention. By limiting its use to headers, short phrases, and accent elements, I maintained a clear visual hierarchy. The font became a tool for emphasis, drawing attention to key messages without overwhelming the user.
For web designers and digital product creators looking to soften their brand image, this typeface is a strong candidate. It offers the warmth of hand-lettering with the reliability of a professionally crafted digital font. Whether you are building a portfolio homepage, a product landing page, or a small business website, testing a font like this can reveal new possibilities for connection. It reminds us that in digital spaces, typography is not just about reading; it is about feeling. And in this case, the feeling is welcoming, genuine, and distinctly human.
