The easiest way of giving your design a distinct identity is by using a motif.

What is a motif?

A motif is a visual idea that recurs in multiple formats and ties the design together. - Erik D. Kennedy, Learn UI Design

Consistency, identity and coherence: Motifs help create a sense of consistency and coherence in your design. By repeating a particular element, such as a symbol, pattern, or color scheme, you establish a visual connection between different parts of your design. This connection makes the design feel deliberate and well-thought-out.

Brand Recognition: Motifs can be a powerful tool for branding. Well-established motifs become synonymous with a brand or product, making it instantly recognizable to consumers.

Emotional Impact: Motifs can be used to convey emotions, tell a story, or evoke a specific mood. For instance, a motif of falling leaves in an autumn-themed design can create a sense of nostalgia and warmth, while a motif of sharp, angular lines may convey a feeling of tension or excitement.

Can you pinpoint the motif here?

It’s a hexagon!

Found in the logo, decorations, and typeface.

What’s the motif here?

It’s the fabric of spacetime!

Anything can be a motif

• Shapes
• Symbols
• Textures
• Filters
• Abstract concepts (like love, outer space, and time)
• Hand-drawn elements
• Digital elements (pixels, binary code, glitches etc)

Shapes

Shapes are fundamental building blocks of design. Geometric shapes like circles, squares, and triangles can be used as motifs to create a sense of order and structure. Irregular or organic shapes, on the other hand, can convey a more natural and freeform aesthetic. Consider how the iconic Coca-Cola bottle's curvaceous shape is a motif that instantly signifies the brand.

Symbols

Symbols hold immense power in design. They often carry cultural or universal meanings. Think of the peace symbol or the recycling logo—these are motifs that immediately convey important messages. Symbols can be integrated into your designs to evoke specific emotions, values, or concepts.

Textures

Textures can add depth and tactile qualities to your designs. Whether it's the roughness of a rustic wood grain, the smoothness of polished metal, or the softness of a plush fabric, textures can be motifs that engage the viewer's senses. They can be used to create a multi-dimensional and immersive experience.

Filters

Filters have become increasingly popular in the age of social media and photography. Applying a filter can be a motif in itself. For example, the vintage sepia filter can evoke a sense of nostalgia, while a high-contrast black and white filter can create a dramatic and bold motif. Filters not only transform the visual appeal but also set the mood for your design.

Abstract Concepts

Abstract concepts, like love, outer space, and time, may not have a concrete visual representation, but they can be transformed into motifs through creative interpretation. Love can be symbolized by intertwined hearts, while outer space can be depicted through galaxies and celestial bodies. Such motifs enable you to convey complex ideas through visual language.

Hand-Drawn Elements

Hand-drawn elements add a personal and unique touch to your designs. They can be motifs themselves, whether it's a custom-made signature, a doodle, or a sketch. Hand-drawn motifs inject a sense of authenticity and human connection into your design, standing out in an increasingly digital world.

Digital Elements

In our digital age, it's only fitting that digital elements themselves can be motifs. Pixels, binary code, and glitches are design elements born from the digital realm. They are a nod to the technological era and can be used to create motifs that resonate with tech-savvy audiences or projects with a futuristic theme.

Pixelation motif in action:

A motif can appear anywhere

The beauty of motifs lies in their versatility. They can be incorporated into a wide range of design elements to create a cohesive and visually appealing composition. Here are some key places where motifs can be employed to enhance your designs:

• Logos
• Text
• Background patterns
• Decorative shapes
• Image framing / masking
• Buttons
• Icons
• Dividers
• Scrollbars

Logos

One of the most common and powerful uses of motifs is in logo design. A well-crafted motif can become the cornerstone of your brand identity. It serves as an instantly recognizable symbol that encapsulates the essence and values of your business. Think about the bitten apple in Apple's logo or the swoosh in Nike's emblem – these motifs are iconic and instantly associated with their respective brands.

Text

Motifs can be integrated into your text, adding a creative touch to your typography. Decorative motifs, such as ornamental swirls or thematic icons, can be used as bullet points, section dividers, or to highlight key phrases. They bring visual interest to your content and make it more engaging and appealing.

Background Patterns

Background patterns can be subtle motifs that add depth and texture to your designs. Whether it's a repeating floral pattern, a geometric grid, or an intricate lattice, these motifs can provide a visually pleasing backdrop that complements your content, making it more visually interesting without overwhelming it.

Decorative Shapes

Incorporating decorative shapes as motifs can be an excellent way to break up monotony and create focal points within your design. For instance, a circular motif can be used to highlight important information, a star motif can emphasize special features, and a heart-shaped motif can draw attention to emotional content.

Image Framing / Masking

Using motifs for image framing or masking allows you to give your visuals a unique edge. Frames adorned with motifs can make your images pop and become more aesthetically pleasing. For example, a travel blog might use motifs of planes and suitcases to frame vacation photos, enhancing the theme.

Buttons

In web and app design, buttons are essential for user interaction. These buttons can also incorporate motifs to add a sense of style and identity. Motif-infused buttons can create a consistent and visually appealing interface, offering both form and function.

Icons

Icons are concise visual representations of specific actions, concepts, or objects. Motifs are often employed in iconography, making these symbols instantly recognizable and reinforcing your design's identity. Icons with motifs also help create a unified visual language for your project.

Dividers

Motif dividers can segment and organize content while adding an artistic touch. Whether you're designing a blog, website, or brochure, motif dividers can make the transition between sections smoother and more visually appealing.

Scrollbars

Even the humble scrollbar can benefit from motifs. By customizing scrollbars with motifs that match your overall design concept, you can create a seamless and harmonious browsing experience for your website or app users.

Can you guess the motif for each layout below?