Getting your on-page visual hierarchy right when laying out your proposal is the most basic starting point. Adobe gives us a brilliant description of Visual Hierarchy for those that require a bit more insight:
“Visual Hierarchy is used to rank design elements and influence in the order you want your users to view them. By using principles like contrast, scale, balance and, more, you can help establish each element in its rightful place and help the most important elements stand out.”
Before you commence the layout process be clear about what content you want to focus on. Size is the most basic but important element for consideration when applying a visual hierarchy to the information on the page. Increase the scale of important components and you’ll draw the eye of your time-short client straight to them. Colours with high contrast will also gain greater attention, and perspective is a great way to create the illusion of separation between components. Typography mustn’t be overlooked; the correct ‘pairing’ of typefaces in combination with subtle differences in size, weight, kerning and alignment can really help to accentuate focus areas.
The use of statistics to reinforce our claims is commonplace when delivering a proposal, but your prospective clients will often be lacking in the time to wade through data. This is particularly pertinent for startups that are presenting successful case studies that demonstrate high conversion rates. Data visualisations are a great way to present the most pivotal information graphically to increase impact and engagement. Presenting stats needs to be digestible. If you don’t have the resource in-house to do this, there are some easy to use, free Saas options out there such as Flourish.
It’s important to remember that Data Visualisations must always be accompanied by text and annotation. Clear titles and labels are indispensable to show your prospective client how to read a visualisation.
Icons can have a multitude of purposes; they enable us to communicate key information without the use of words, they give context to what we’re presenting in text, they can serve to simplify complex concepts, act as aids for classification, or they can simply inject a bit of fun or brand personality.
Icons are easily digestible and rapidly understood. They are a great tool for aiding and simplifying lengthy blocks of text, or complex concepts.
Everyone has what Adobe describes as a “subconscious viewing pattern” which they use to scan the contents of a page. Adobe advises that this typically differs from person to person, and may alter depending on the content that an individual is viewing, but two common patterns are the Z pattern and the F pattern. If you can compose your page to follow the pattern, you can steer your reader to the components on the page in the order you want them to be viewed.
What may sound like waffle, is a series of frameworks or components that aid the visual digestion of chunks of information. Proposals are often information-heavy, so pulling out and framing that information in a way that your time-poor client can easily digest is important. Word clouds (or tags clouds) are often used to depict keyword metadata but can be a handy way for startups particularly to present market trends, your team structure, global distribution of people, or even brainstormed ideas. Timelines are a clear way to present the history of your company, key hires, milestones, or product launches. And, tiled layouts enable you to group small chunks of information that may read easier side by side rather than in a long list format.
Globally, more than 2.2 billion people have a sight impairment. While the consideration of accessibility isn’t going to help your proposal convert, it does ensure that the team that you’re presenting it to won’t face any barriers in reading and understanding it, especially if you opt to present your proposal in a digital format.
If you’re a digital agency that designs for the online space, then it’s bad practice to ignore guidelines in any of your collateral. Make use of space and separation. Employ high contrast colours, and be mindful of the WGAC guidelines. There are some great free tools out there such as coolors.co and Adobe Color that enable you to easily check the suitability of a colour palette across different types of colour blindness.