Website Design Sprint
Last updated
Last updated
Sprint questions summarise the design challenges and make the goals of the prototyping and user research clear. These should reflect your understanding of the design challenges and shifts the focus of the prototype onto three particular areas. Read more here.
Write a coherent user story. A user story consists of 6 steps, which describe how a user would experience a product. Starting from something like the first contact with the product and ending with the desired activity. If the product already exists, write out the existing primary user journey. If it doesn't exist, write a basic hypothetical user journey.
Submit research . During the research phase it's important to bring up examples from other products with similar design challenges.
Submit research . During the research phase it's important to bring up examples from other products with similar design challenges.
During the workshop, ensure you understand the clients visual design needs and requests. Set the visual direction of the key prototype screen.
What to do if the client has existing branding or style guide?
Make sure you have everything you need.
If the visual style guide is poor, or the branding has been executed poorly by another agency or person:
Recommend the client starts with a new brand or visual identity.
Explain why the assets the client has are not good for the current execution.
Give them the option to stick with the visual identity they have.
By the end of the workshop, be able to define visual direction of the project. Record a summary video for user researcher with this information. Develop a high-fidelity visual identity based on the styleboards that match the client brand values. This way, the product designer is giving them the highest possible value. And we've attempted to avoid association with negative design work.
Articulate the visual direction including foundational styles (colors, fonts, grid) and components (buttons, nav, fields etc.) to speed up ongoing work and send it to the Website Designer so they can begin drafting the Key pages. Make sure to also send any relevant information about visual direction to Illustration Designers and Logo Designers.
During the workshops you will have to create a sketch of an interface on paper. By creating a sketch that could make it into the final product, you provide a lot of value to the client and prove your knowledge in UX and on the topic of the project.
Here are some recommendations for a compelling concept:
Creating a compelling conceptIn this segment, everyone will create a user journey based on the most voted user journey of the first session. During the exercise, make sure everyone is mindful of the tight schedule and maintains focus only on the most important screens of the user flow In case the team wants to include additional, out-of-scope screens explain that doing so will come at a compromise of the LTG and Sprint Questions and we highly recommend to design the main user flow first. If additional screens are still required, they can be added to the scope and final invoice.
Contribute to storyboarding with useful elements. A storyboard is almost like a wireframe and often needs clear guidance to avoid over-complicating the interface. You should have an intuition how the product could look once it's designed and help the team arrange the elements in a way that supports the understanding of the user.
During the storyboarding session, your task is to understand what the team's intentions are for the product and visualize it in simple ways. The goal is to create a basic concept with all necessary details so you can design the prototype with high visual fidelity, without external support.
As the designer on the collaboration, you need to enforce that all the content and decisions are made by the team during the storyboard. It is essential that you don't have to make these or fill in the gaps during the prototyping as there is no time.
During the storyboard, at each break, you need to estimate what you are capable of designing during the two or three days of prototyping. E.g.: We've designed three screens at this first break and I estimate that due to the complexity, these are going to take 50% of my available time during the prototyping process. Please bear this in mind as we go into details on the next six screens.
It's your responisbility with the illustrator to define what the illustrations should convey and decide on the styling: e.g. infographics vs. conceptional.
As the visual designer, it's your responsibility to set up and host the visual review workshop.
Prepare: Clearly demonstrate different options and where you need the client to make decisions. E.g.:
Show a choice between two different visual styles.
Or show a choice between details such as typography, alignment or colour.
Present: explain the rationale between the different choices and directions.
Voting: ask the client team (less the decider) to choose their preferred options based on your rationale and recommendations.
Discussion: Have the client team present their reasons and spark a further detailed discussion. This could inform iterations in the design.
Decider vote: Have the decider choose the direction to follow and take note of any additional comments.
The presentation can either be during a single Hypersprint as a conclusion, or alternatively as an iteration workshop. Here is a detailed overview of the process:
Iteration WorkshopMake sure the prototype is done on time and present the results to the clients. Reveal the results with confidence. Remember that this is the first glance for the client to see their product and learn about how it works. Here's an example:
Friends! It was an incredible week! And we have something really cool for you. In the next hour we will show you the prototype we created together and [the designers] designed, [the user researcher] will tell you how your users liked it and explain to you what that means for the product.
Present the prototype (10-15 min). Afterward, have the user researcher present their results (15-20 min).
If there were Quick Fixes in the prototype, show these after the User Researcher finished (2 min).
After that, they can ask questions and think that the session is over.
Right before they are about to leave, stop and pretend you remembered something else. Like this:
Oh, one more thing! We actually have something else to share with you.
Then present all free content you could share with them, the video tutorials, workshop templates, user research guides and link to our Discord.
About half-way through making UX adjustments, have a short review/feedback workshop to get the client to sign off on visual designs and any additional changes before continuing with brand guidelines and final version of the landing.
Based on this workshop, finish the final iteration.
