UX Checklist For Web Projects

ux checklist for web projects INVESTIGATE Analyse the competition Analyse Get user feedback your data Expore how others have solved the problem you're setting out to you have and how useful it is. Is solve. How much can you reuse? (Rreinventing the wheel is stupid you know). Make an inventory of the data What material do you have from the users about their experience? Are there surveys? Are there old support tickets? Dig 'em out and analyse them! all the data to make informed decisions there? Analyse clicks, page views, conversions, funnels etc. PLAN Write user Plot user Clear the way stories flows This is a good time to start doing personas. Write down initial user stories and related Start plotting user flows based on the scenarios you defined in the previous step. These will be useful when you start creating your wireframes. Define important routes for your product and you'll be able to identify, prioritise and eliminate any usability obstacles on key user journeys. scenarios. EXPLORE Wireframe your ideas Start prototyping Brainstorm & sketch out ideas Get everybody together in a room filled with beverages, food sketches into wireframes. and snacks. Talk, discuss, sing, think up crazy stuff. Remember to never censor & dismiss ideas! Start with paper sketches then move directly to sketching out clickable prototypes in HTML. Use Bootstrap, it's easy and things will look great quickly. Formalize the best ideas and Reuse validated user flows and pages from earlier projects. COMMUNICATE Grok the language of your users Create information Analyse degree of accessabilty architecture In what context will your product Analyse what degree of be used and by whom? How do Make an effort to really understand your users and how your data is structured. Organize they talk? How does your brand need. Are they using weird your navigation in a clear and understandable way. accessability your users will relate to both context and users? devices? Are they perhaps color blind? Be pragmatic. CREATE Identify important Ul elements Identify important gestures Decide degree of responsiveness Create a small set of initial Again, what devices will your users use to access your Do you need to design for the apple watch already now? What designing your Ul elements from content and what demands does about tablets? Can you get away with "default" media queries or do you need to write your own? guidelines and then start that. Stressed for time? Use that put on gesture support? Bootstrap. GIVE FEEDBACK Design for times Error Design completed actions wai handling Have you taken into consideration all the states when your product is loading something? Have you simulated bad connections? How does it If your users did something wrong tell them in a clear and concise way what they did wrong. If you did something wrong, tell them something went you if you completed something wrong and apologize. Tell your users when they've successfully completed an action. It's very frustrating when the system you use doesn't tell work on 3G connections? successfully. FINALISE Finish up final layout Define image & icon usage Define hierarchy of type and color Create a first version of your final design, then another one, then another, then another. Iterate until you think you've Test and analyse your usage of icons and imagery. Maybe you don't need icons in the main Remember the guidelines you created for your Ul elements? Now is the time to expand on navigation (btw, you probably don't.). Are the images you use "on-brand" and relevant? those. Define a sensible hierarchy for typography and for colors. (less is more). nalied it. DELIGHT Craft your micro-copy Define & design micro interactions Define & design transitions If you use transitions it should A lot of design is actually copywriting. Micro copy is all those small nuggets of text you Spinners, hover effects. Easter eggs? harmonize with the rest of the system. If you decide to use transitions, use it sparsely and only when it reninforces the existing UI. can use to create a more emotional bond with your users. Just don't overdo it. ANALYSE Define a plan for A/B tests Create a KPI Test, test, test document Write down what success and test, learn, fix. test, learn, fix. test, learn, fix. test, learn, fix. test, learn, fix. test, learn, fix. test, learn, fix. test, learn, fix. test, learn, fix. test, learn, fix. Your initial design should not be the final design. Plan out how failure would like like for this project. Create key performance you plan to make it better by indicators that alert you on how you're doing. incrementally improving it through A/B tests. test, learn, fix. futyJU NTOO