Getting a web design project off the ground

Navigating the path of web design

Getting a web design project off the ground is exciting for designers as well as for clients. Navigating through that process can be intimidating too, as there needs to be much discussion about scope definition, budget, timeline, legacy content, usability, sitemap, etc. Most importantly, it is critical to establish what the client actually defines as a 'project success'; the client may not be able to articulate it, but together you must have a discussion about what this means to all members of the team. In this blog, we are examining a web design project path, not looking at the commercial or schedule restrictions, but suggesting a linear approach from discovery to design 'sign off'.

Getting to know the project team

Set aside some time to get to know the team members on the project, your client, any other stakeholder and any third party contributors; learn their strength and weaknesses, as good communications between the stakeholders is key to the success of a project. Learn the expectations of each team member and make sure you understand the expectations for the project.

Ask questions, don't hold back

From outset ask the client if they submitted all the information they keep, such as user-testing survey results, insights etc. The client may not think this information relevant to a web design project, but it is. Gather all the project assets such as brand guidelines, logos, visual communications documents and discuss any legacy problems with the online branding, taxonomy and a good amount of web content etc.

Ask the client the following questions:

  • What are the main business goals and priorities for the website?
  • What is the value is of the redesign? at this point in time?
  • What are the user needs?
  • What are the brand needs?
  • What about existing user research?
  • Has any user-testing on the current website been undertaken?
  • How will the success of the project be measured?
  • Is the online marketing sorted?
  • And what other marketing materials and campaigns are there supporting the new website?

Request some examples of likes and dislikes and ask them to qualify these examples. Discuss the design of a new logo now, if that is required as this may change the timeline.

Needs VS Wants

Most clients think that their website should be a tool for all people. Needs will make a website successful, Wants are all things that can be done with the website, the latter will lose focus. It's so important to focus on needs and to establish early on the MVP, the idea being to provide the end user with something that offers just enough to satisfy their main desires, and nothing more.

Research, and read the brief

Take time to research the client. Undertake a Discovery in focus groups on site, so you know what and whom you are dealing with. Get to know the competition and their approaches. Look at trends and standards. Read the brief, twice, three times. Don't read into it. Ask the client to explain the brief. Sit with your project team and create a list of priorities to answer the brief, establish the milestones within the design process. If there isn't a brief, help the client write a brief, it is the only way forward.

Here some questions to help establish the design brief:

  • How do you want people to feel when they come to your site?
  • Look and feel: Evolution or revolution?
  • Message objectives/hierarchies?
  • Colours, logos, branding, fonts etc
  • Dos and donts?
  • Magic wand / wish list?

__

The Discovery

The Discovery process

Understanding the audience and the 'jobs-to-be-done' - don't make assumptions

Get to grips with all the question relating to the user/ audience, and don't make assumptions. To design well from outset use JTBD to focus on the job that people are wanting to do, rather than the attributes around that person. Learn about the user motivation, the situation they are in and their pain, anxieties which may make them struggle to interact with the website and complete a call to action. (Example: When I am sitting at my desk, searching for a new sofa - (Situation), I want to see the images clearly together with the prices - motivation, so that I may compare and purchase the product with that knowledge - outcome). A wireframe tool such as Axure may help for this exercise.

 

 

“People don't want a quarter-inch drill, they want a quarter-inch hole.”

Theodore Levitt

 

Content first - tell the story

Content drives the traffic and engagement, and this intern drives the user to act. It is important to have a vision of what the website could/should look like, however, it is more important to think how the design can enable the content, to make it accessible and appealing to the user, so that she/he can interact. Voice and one are critical, a good story allows better reading, and the story is important in the description of the vision, description of services or products, and conveying the feel of the brand. The words are the tool that shapes the design, as different words on a call to action, for example, create a different experience.

Set some design standards and respect web standards too

Discuss with your project team the web standard that now has been established, talk to them about good design standards and why it is important to establish these from outset, as they help with the outcome. Identify the 'sign off authority'. And do not allow 'design by committee'; make sure that everyone in the team knows this is a recipe for disaster. Focus on the end product (everyone wants to have their most important bit on the homepage), and assure that this is managed well, help with the internal politics, always bearing in mind what you actually want to user to achieve or do.

Keep it simple - mobile-first approach to help with difficult designs decisions

If you keep the navigation simple for mobile for an optimised user experience, this will translate well into the desktop design. Help the user to navigate intuitively. A good prototype tool such as Invision helps establish the user-journey and test with the client how the user interacts on all platforms. It helps answer many questions at outset and helps you think about the engagement with the content.

Be creative and coherent

Even though designers don't like it when clients say 'just be creative', as this gives no insight into what they actually envision, it is important to think outside the box, to experiment and to be creative. The project assets may set the direction clearly but this is a good time to also undertake a 'wild card' design to make the project team think. This allows to test the brand messages and align the online presence. If possible allow a bit of time for this creative process within the timeline, as especially if you are establishing a long-term partnership with this client, the outcome of this research could be used at a later stage for inspiration, and it is a valuable investment.

Coherence is important as it asks for reasoning for every design detail. It means talking to the user in a similar tone across the User Interface. It means following the key brand elements but being creative around those.

All members of the project team need to understand why design needs to work well...

... and that the design needs to be agile enough to allow for content changes. Pretty pictures are nice, but the content editor needs to have the right tools to create engaging content blocks. Discuss with the editor what content component they require, and this may drive a big part of the design process. Maybe even show the client early how the content management system works, as this will give them an insight into your design decisions.

Reviewing the design

Reactions to initial mood board and designs will always be emotive, everyone has an opinion about design. Make sure that even early the design is critiqued against the brief, and that your client remains within that framework, as it is easy to go off on a tangent, looking at hundreds of other websites they may also like. Remind the team of the objectives and focus on what the website needs to achieve, the designer can then find good design solutions. An interactive prototype may give the impression of how the website will feel like, recently we have found though that people focus too much on the detail of that user-journey. We suggest that this phase is critical, but at the beginning where we are trying to establish a look and feel, and for the client to commit to that, it may be easier to keep it simple and show flat design with certain components such as a mobile menu or a highlight box indicating the functionality within the look and feel. This can then be signed off by all stakeholders, and the project team can then embark on the details of the user-journey in context of the next design phase. Because design is all about detail.

Test early to help with conversion

It is easy to get excited about a first direction and to continue with it too far, without testing it with users. A prototype tool and Chalkmark testing period is great and gives good insight on task-oriented success rates by getting quick feedback on design decisions and any assumptions made. In the project, schedule plan allows time for this, as after the build it is too late to incorporate essential findings.

 

Usertesting_02

A design doesn't need to be complicated - the case for white space

We don't need to create something beautiful to be effective, but a good design makes it easier to use and appreciate it. Combining pretty with useful is the aim. Keeping a design simple requires skills as the right design decisions need to be made on what is really necessary and what is clutter. In interaction design, white space or 'negative space', refers to the empty space between and around elements of a design or page layout. It is often overlooked and neglected. Designers believe in using white space for elegance and ensuring a quality user experience. Unfortunately, not all clients appreciate the need to allow for this white space. The trends, however, are changing, and we welcome this trend as white space is a powerful design tool which can focus content.

The value of white space

Interpreting the design feedback

Again it is important to outline the objectives of a design review, and in most cases that is to find the long-lasting overall design direction for the organisation. 'I don't like it' must be the most useless sentence in the history of design. It may reflect the observer's opinions, but learn more about what’s not working for a client and that will give you more steer for the next design stage. It is a fine balance between imposing a design opinion, listening to the client, and adhering to design standards. Reminding the project team of the project objectives may avoid a discussion about design details. It is the project manager's skill to lead this discussion carefully and making sure that each project team member contributes feedback relating to their expertise. This is of course never easy. Best to offer designs in batches, and building up the blocks, so for example, design a mobile homepage with navigation first and then test how this translates into desktop and other platforms and adjust the design process accordingly.

Make sure the design is signed off

Achieving a design sign off can be a drawn-out process, but it is important, as it aligns the project team with the objectives of the project, and acknowledges that all questions have been asked and answered. Of course, that is the theory, in practice, many more questions will come when the design is coming to build when content is entered, but it feels like a good milestone for the team. And of course, it gives the designer the affirmation that the client is happy with the design and that in case there are any changes all parties are aware of the implications.

Conclusion

In theory, this process can be linear, but usually, it is not, because people's opinions and personalities affect the project flow. Each project brings different challenges; one of the biggest challenges for us is to focus on that objective (on the hole to be drilled) and to try to convince the client that it is worth taking the time for a good discovery and enough time for the design phase, as the outcome will reflect that investment.

 

thehole