Two decades ago, broadband was emerging fast and the world wide web established itself as an innovative medium for creatives. Visual designers set out to evoke consumer emotions that would lead to positive brand experiences and ultimately increase revenues. These goals haven’t changed much in the last twenty years, but the media used has evolved rapidly.
Today, even as the desktop web has evolved into the mobile web, a visual designer's goal has remained the same: to evoke emotions that will produce the desired outcomes. But on the mobile web, this is often coming up short.
When any page is designed, marketers want users to feel positive, curious, excited and interested. But too often users end up feeling frustrated, annoyed, or impatient when they load pages on mobile devices. Why? Because it takes too long for beautiful designs to load, and if a person doesn't wait for a page to load, then the design components are meaningless.
You might be thinking this is not my issue, it’s my developer’s responsibility, its tech… However, the most likely reason why the page is loading slowly is because of the size and quantity of images chosen; the number of visual elements and design complexity decided on; and the variety of fonts used. These are designers' decisions to make. At best, developers can apply some magic to optimise the designs. These optimisations are often limited to improving the speed of a web page by 20-30%. It is more efficient to deliver something faster if it is part of the design criteria. As a developer, it would free up their bandwidth and allow them to focus on other differentiator factors affecting conversion rates.
Business’s should be focusing on decluttering noise from design and accentuating the critical benefits. Embodying the notion of mobile first through shrinking, serving, simplifying and sharing. Designers must become masters of the limitations presented to them. Here are four tips to help you get there.
1. Use speed performance budgets to guide decisions
A speed performance budget is a method of ensuring that designers, developers and business stakeholders hold each other accountable for delivering fast web pages. For example, the budget caps the number of seconds it takes for a design to fully load on a 3G connection. By 2020 3G will cover 70% of cellular network connections globally at either 3G or faster speeds. A good best practice is three seconds or less—53% of visits are abandoned if a mobile site takes longer than three seconds to load.
2. Provide agency partners with speed criteria
If controls and goals are not in place, the challenge won’t be met. Both parties, developers and designers, must both work simultaneously toward speed goals.
3. Design for mobile technologies that are built with speed in mind
Any technology is still only an optimisation of design decisions, but understanding how to design for them is a good first step. A rule of thumb is to focus on the most important point in a design and eliminate features that do not support that point or general user-interface requirements.
4. Embrace Limitations
Including speed as part of the design process is no different than accounting for the limitations of other creative mediums. Designers would not create a four-colour ad for a black-and-white print publication, or produce a 30-second video for a 15-second slot. If we don't design within the medium's limitations, the result is a bad experience.
Designers are capable of creating compelling designs within any medium. Mobile is no different. Once we learn to incorporate speed as a dimension of our design process, utilising tools such as speed performance budgets and technologies, we can ensure that the emotions we intend to evoke are the ones that people have when they experience our designs.
Traff1k D1g1tal drive your digital growth by improving you company’s digital capabilities, from enhancing your digital strategy incorporating Search Engine marketing to Social Media, web design and development, we’ve got you covered. Below are a few examples of the synergies that visual design and developers are able to create to enhance the users web experience.
Source: Think With Google