Web designTips

Why you should think of web building as part of a larger system

Why you should think of web building as part of a larger system

Sam Kapila explains why the sites you create are only part of a larger end product.

It's easy to get caught up in all the elements related to building a site: content, code, design, testing, and so on. So much goes into that final deliverable that we can forget about how the site comes across to a user, how scalable it is, and how long it can last.

These questions focus on the experience of what we create. The core of brand design is that experience. In his book, The Brand Gap, brand strategist Marty Neumeier defines a brand as "a person's gut feeling about a product, service, or company". By following this definition, it is safe to say that what we create needs to translate into a larger, global end product, where one deliverable – like a website – isn't the product, but just one component of it. The more brand- and system-based thinking we bring into web design, the better off web design will be.

Advertisement

Some branding ideas have already become standard in the web design process. Element Collages and Style Tiles, for example, are two techniques that call for systems. There are a few goals worth reaching to achieve a systems-based outcome. These include creating consistency, portraying authenticity, and striving for longevity.

Consistency

In branding, consistency is the common goal. As consumers, we know what to expect from brands we are loyal to, because they are consistent. Companies want consumers who will stay loyal to their brand, and many understand they need to maintain trust to keep us around. Web projects should work the same way.

Treating similar elements on a project the same way makes the user understand how to interact with that type of element. Underlined links, article sub-headers, or other consistently designed elements allow users to understand the design as a language. That language can be translated from deliverable to deliverable so the brand is consistent. Once we create consistency, we can become authentic.

Authenticity

In 2013, we saw the rise of flat design. Designers and non-designers alike headed to social media to share their frustrations about the sudden changes to their favourite brands' websites and apps.

In this case, brand identity was simply ignored. Design trends aren't authentic to every single brand. Brand authenticity is at risk if that brand's system changes with every trend. Instead, define a goal for your design and then build a design system that is based on reaching it. When the design system stays authentic to that goal, authenticity towards users is maintained in the long run.

Longevity

Amazon is famous for maintaining a strong brand. It has a solid brand system in place and therefore is able to redesign iteratively without alienating its users. Rather than a sudden big reveal in which many elements change, Amazon has benefited from adapting one element at a time. In fact, as a constant user, I didn't even notice the design was changing until someone mentioned it: I was too busy buying books, which was Amazon's goal in the first place. Creating for the long term requires understanding the system and creating a thoughtful strategy that extends the lifespan of a living system.

Design systems need not fit a single mould. Many designers' systems include various elements: both visual and interactive. Laura Kalbag's design systems include typography, colour, grid, and content, while Brad Frost's Atomic Design includes five levels of elements: atoms, molecules, organisms, templates and pages. However you choose to define a design system, strengthen it by favouring consistency, authenticity, and longevity. Start by asking if each element helps reach the end goal and then build a design system and language that appeals to the user's gut in the way you intended.

Words: Sam Kapila

Sam Kapila is a designer and web design educator. She is co-host of The ATX Web Show! and Non Breaking Space Show podcasts. This article originally appeared in net magazine issue 254.

Advert

Log in to Creative Bloq with your preferred social network to comment

OR

Log in with your Creative Bloq account

site stat collection