02 January 2017
I’ve been working with a client recently on the website design for a new business with a B2B audience for a service where authority, security and reliability are critical.
I’m not able to say any more about the specifics of this project — but I wanted to share the research I’d done looking in general at other websites where security and reassurance are integral to the design.
We’re looking primarily at websites for government bodies or financial services. People using these sites are looking for credentials, credibility and reassurance. The following list shows sites that have different levels of validity to our targeted look/feel of authoritative government or bureau site. But they all have elements that might help inform the site’s direction. Screen shots are shown — but this tells only a tiny part of the story. Visit the websites to see overall feel and flow through pages which is as important as the headline graphic.
A mixed bag — with slightly off brand ‘hipster’ style lead graphics. But some strong design elements through the site to add visual interest and add reassurance to customers.
Media rich, global and established but presented in a contemporary and brave design.
Engaging graphics. Clearly established and at home with big brands, but minimal use of content to suggest assurance and focus on the key selling points.
Interesting vertical split between 2 areas on the site. Tone of site is subtle but focuses on clear presentation of facts in an authoritative manner.
Surprisingly modern and engaging design for Obama, for a sector you’d expect to be playing things very safe. Shows traditional, bureaucratic style sites aren’t requirement for presenting credibility and confidence in a nervous market.
Beautiful design — powerful presentation of data to support fundraising and customer confidence.
Elegant design for established blue chip organisation.
Looks like a site that has lost a little something in the execution — but shows the approach to make a more interesting design for an audience that need to be reassured and risk averse.
Well established US company offering personal finance services. Their previous site was widely referenced as a good example of successful UX design — combining emotionally engaging design and presentation of complex/dull financial information in a style that is reassuring and credible. With their history — it’s reasonable to assume this design has been widely tested and delivering positive responses from customers.
Almost all sites use photography, supported with illustrations/graphics/screenshots where appropriate. Photography perhaps serves to ground the design and give users a more tangible human connection than illustrations.
For the project I’m working on, the immediate challenge I identified is in successfully bridging the gap in presentation between the formal, traditional (and dull) designs that have been associated with ‘security, established, responsible’ — and the more contemporary, dynamic and ‘new’ designs that have the potential to show customers the value in the business’s offerings against more traditional/established companies.
A very generalised breakdown of visual distinctions between traditional and contemporary design.
Traditional: Photography | Serif Font | Muted Palette (esp Blue)
Contemporary:Illustration | Sans Serif | Bright Colours
Many of the referenced sites bring in elements off both lists.
Movement & Sullivan combine sans & serif fonts on the site. It adds some visual interest to the typography regardless — but both have chosen to use a serif font (exaggerated further by using italicised faces) in the main menu. As one of the first things a user will see, it’s an interesting device to give an immediately traditional feel — that can then be contracted with more contemporary elements elsewhere.
Barack Obama uses a serif font widely across the site — with lots of whitespace and large line heights and links in bright colours. It’s a successful mix of a more traditional and contemporary typographical approaches.
A similar approach is taken by Pamlico Capital — a seemingly safe, traditional and non-challenging typographic approach but with white space, background images and subtle animations gives a modern and reassuring feel to users. Blues, Green and Orange dominate these referenced sites:
Blue is often associated with responsibility. Dark blue provokes a sense of security. It is strong and stable, a great choice for corporate design.
Green is often associated with wealth, renewal and nature. It shares the same sense of security as blue while providing the energy of yellow.
Orange is often associated with risk and spontaneity and is the combination of red and yellow (Blue & Green’s complimentary colours). Orange can be used to provide a sense of movement. It does a better job of grabbing the user’s attention when compared to its counterpart, the colour yellow.