The Unsung Heroes of Design: The Vital Role of Moodboards, Autolayout, Typography and BI


When I first began my career in UX design, Figma lacked an Autolayout function, Adobe was hardly useful in this regard, and responsive design was a daunting challenge with the limited tools available. Amidst the familiar design mantras like "do your research" and "prioritize hierarchy," there exist hidden gems—devices and strategies—that are exceptionally beneficial for budding designers. These tools are crucial because they provide not just approaches, but tangible techniques, bridging the gap between theory and practice. In conversations with fellow designers, I realized we all faced a common struggle—the abundance of advice in clear yet ambiguous terms. As a new designer, you yearn for concrete techniques rather than abstract philosophies. In this article, I share insights gained through both failures and successes, aiming to demystify these tools and fill in the technical gaps for emerging designers. Let's embark on a journey to explore these unsung heroes that enhance both design and SEO in brand identity creation.

Autolayout: The Foundation of a Seamless Design

Autolayout forms the bedrock of a well-structured design. It' s monumentally important because it easily helps designers understand the significance or and HOW TO execute grids/grid points. It ensures that elements within a design respond seamlessly to different screen sizes and orientations, offering a consistent and delightful user experience. I plug everything into auto-layout when I can and use wrap like crazy now to help me efficiently and properly perform redesign (it also doesn't hurt that using and knowing of 'wrap' will help with handover since 'wrap' is also used by developers).

Tool: Figma's Autolayout feature empowers designers to effortlessly create adaptable designs, saving time and effort in the design process.

Tip: Utilize Autolayout to craft adaptable components and layouts, enhancing user experience and application performance.

Moodboards: Setting the Emotional Palette

Now, I know a lot of designers say they use mood boards but do they really? I like to divide my moodboards into 5 categories: graphics (the image & icon style that fits the project), typography, palettes, counter design (so designs that typically you wouldn't see for this product) and web/mobile design. Moodboards helps you come up with the story for your design choices, or, for my left-brain folks, mood boards are like your ER where you can see how everything will be interconnected.

Tool: InVision, offers an basic design canvas to craft moodboards.

Tip: Experiment with different styles and themes on your moodboard, do something that may be unexpected for that industry as it may lead to an actually implementable concept.

Typography: The Silent Brand Communicator

Let's not forget about typography. This, to me, is a brand make or breaker. It embodies the brands personality and values (i.e. cheeky font to me suggests the brand is playful). Choosing the right typography isn't just about aesthetics; it's about strategic communication. Every font family, from the classic serif to the modern sans-serif, has its own unique feel and association. Serif fonts often convey tradition, reliability, and sophistication, while sans-serif fonts lean towards modernity, simplicity, and clarity.

Tool: MixFonts & FontPair offer automated recommendations for type combinations.

Tip: Experiment with high contrasting fonts, if you go bold with a heading font (which usually is the only font you want to play with for accessibility purposes) you should be subtle with the body font.

User Research Interview Feedback: A Human-Centric Approach

How much would you trust me if I didn't speak about the research? New and senior UX designers probably know of the importance of research results, however, I find they often don't use the feedback from user research interviews for more than the foundation of the UI. I highly recommend tapping into the data to get everything. I've gotten taglines, brand colors, body copy, and graphic style from my users. Users and user data is the gift that keeps on giving. Try your best to not just compile data but reformat it; what are the users actually telling you about what makes them happy? Can any of that be extracted and just changed around a bit to become a tagline or copy?

Tool: Vowel and Fireflies are pretty good platforms to conduct user research interviews as they both automate the note taking which, can let you focus on converting just basic stuff the user is telling you into something profound.

Tip: Focus on paraphrasing feedback in real time, to understand the holistic experience and emotional impact of the brand your working to grow.


These often overlooked tools and methods form the bedrock of an effective brand identity design. Autolayout, Moodboards, Typography, and User Research Interview Feedback are spoken about but their real value, especially for new designers looking for techniques, goes unnoticed by senior designers that kind of mull over the same talking points. I believe constantly using these mechanisms and methods will give you the technical faculty you ( as a new or tested) designer are looking for.

It’s the fusion of art and science that truly makes a design stand out. Happy designing and optimizing!

Created using Figma
Purchase template