Use Project Policies as Creative Limitations to Improve the End User Experience (Part 1)
Project policies promote good practices and technical standards. As well as establishing a high level of quality for the final product, they also help to keep stakeholders focused. When you set boundaries to problem-solving, finding a solution then becomes easier. Needless to say, time and budget are generally the most common creativity-limiting constraints, and thus need to be leveraged.
When we get asked how is it we ensure clients and stakeholders remain focused once work on the more “creative” aspects get started. Our straightforward answer: setting project policies can help you to manage clients and stakeholders.
By agreeing on a set of policies and the level of quality expected early on — all written down in a signed contract — you reduce the risk of internal conflicts and/or personal subjectivity arising. By setting the rules of the game up front, it becomes easier for all parties to remain focused on the things that matter. Thus, whenever we find ourselves stuck due to some form of decision-making paralysis, we always check the proposed options against the set policies.
What do these policies look like? It’s always a good idea to establish some general web governance policies. But we also always establish policies in relation to interface design and development:
- Web standards conformance
- Content parity
- Performance
- Information budget
- Content priorities
- Accessibility conformance
- ROT content management
- Stakeholders & user research
In this article we will cover the first three items from the list, with the rest to be covered in Part 2 of the article next week.
1. Web standards conformance
Policy example: “HTML and CSS must be valid.”
By adhering to web standards you avoid implementing inadequate solutions. Even so, writing valid code alone does not guarantee a website conforms to web standards but offers a good starting point. If nothing else it allows you to reaffirm the quality of any front-end especially one developed by a third-party (who often break down front-end code into series of includes to match any back-end logic). Remember, W3C provide online validators for HTML and CSS.
2. Content parity
Policy example: “Everyone should have access to the same content, regardless of the device used.”
Under no circumstance should your content strategy be tailored towards specific device types. If content is relevant, it should be accessible in its entirety regardless of the device type or its characteristics. Yet, given that certain devices characteristics such as viewport size, memory etc., vary it may be necessary to optimize the presentation of content due to information density and/or performance issues.
With regards to addressing information density issues, rather than simplify or remove content you can instead defer the display of certain content. This can be done using the Progressive disclosure pattern. Here, content gets hidden from the initial view and displayed when a user initiates (clicks a link) or performs an action (continues scrolling). But, make sure hidden content remains accessible should CSS or JavaScript fail to load. You can also improve content performance by providing alternative (faster) media types while still providing a rich visual experience. For instance, use an image of a map instead of an interactive map (usually delivered in an iframe), and link the image to the full interactive map.
3. Performance
Policy example: “The website must perform at least 20% faster in comparison to the competition.”
Performance is a hot topic nowadays and goes beyond just optimizing interface graphics, images and multimedia. It can be just as applicable to HTML, CSS, JavaScript, Web fonts as well as databases (if utilized), networking and hardware. Smashing Magazine published a comprehensive performance case study which contains some useful techniques and ideas.
By setting an overall performance target, you’ll help clients and stakeholders to remain focussed and minimise additional scope creep. In our policy example, you can see we explicitly mention 20%, and it is not just a random number either. In fact, it is something we usually insist on including in all our client projects, the reason being:
People perceive tasks as faster or slower than other tasks when the difference in time is at least 20% slower or faster. — Tim Kadlec, Fast Enough
User experience in relation websites, products or services, is not just about establishing a usable design. Implementing an optimized front-end architecture along with an effective networking solution is as important. If either of the latter fall short, the user experience will get affected regardless of how great a design might be.
Hence, it’s important to explain performance to all stakeholders early on in a project. With stakeholders who are non-technical, you may need to translate performance statistics so that they can resonate more with them. For instance, lost income per failed checkout conversion as response times increase. Feel free to reuse any of the following findings and case studies on the impact performance can have on the user experience.
Number of items on a page
Policy example: “A page cannot exceed 500 KB in size.”
While it ensures consistent page loading performances, it stops stakeholders from overloading pages with unnecessary content. By placing limits on high res photos, web fonts etc., stakeholders can instead focus on providing content that adds value to a user. Be careful to not stifle creativity by enforcing draconian limits. See what limits work best for you and your users and start from there.
3 important limits
Policy example: “Response times for each page must not exceed 1 second.”
Maintaining the focus of a user is key to ensuring a good user experience for it will only lead to better and sustained conversions. Therefore, developing experiences that are fast and responsive are crucial. The Nielsen Norman Group suggests 3 important time limits to keep in mind when optimizing response time performance:
- 0.1 second is about the limit for having the user feel that the system is reacting instantaneously.
- 1.0 second is about the limit for the user’s flow of thought to stay uninterrupted.
- 10 seconds is about the limit for keeping the user’s attention focused on the dialogue.
Maximum cost per visit
Policy example: “The maximum cost per visit should be no more than $0.20.”
Identify how much it costs a user to use your website via a mobile network in a specific country. More so, if your user base is resident in countries where data networks are more expensive or not as up-to-date i.e. 2G, 3G, 4G, 5G. As such, bear in mind that a user’s usage may be curtailed due to such costs. Therefore, when investigating be sure to include “maximum cost per visit” as one of the key performance requirements.
PageSpeed Score
Policy example: “The site should return a green Pagespeed score, ideally 100/100 on both desktop and mobile.”
While this policy could form part of the overall performance policy, on its own it provides for much greater impact. Stress to clients and stakeholders how Google favors websites that are performance and mobile optimized. Who knows, Google may even introduce a Slow label into the search results. If you still haven’t, you can analyze Page Speed Score for any website.
Creative Nights is a UX design consultancy specialized in planning, designing and building fast and effective websites and digital products. Get in touch and join our list of happy clients or see us in action at one of our public workshops.
