GithubHelp home page GithubHelp logo

rlugojr / uxchecklist.github.io Goto Github PK

View Code? Open in Web Editor NEW

This project forked from uxchecklist/uxchecklist.github.io

0.0 2.0 0.0 1.33 MB

ux project checklist

CSS 25.81% HTML 43.66% JavaScript 30.53%

uxchecklist.github.io's Introduction

UX Project Checklist

Start your next UX project with this checklist and don't forget anything!

###Research

#####Competitive Analysis See how others solve similar problems and try to not reinvent the wheel.

#####Data analysis Do you have all the useful data you need? Try to have a look at funnels, clicks, page views, performance...

#####User feedback Always speak with the Customer Care team! Don't have one? Check your old surveys or videos. What do your customers say? What do they actually do?

###Plan

#####User stories Have you done personas yet? If not, DO IT NOW. Ok, now use them to write down user stories and scenarios.

#####User flows Create your user's flow based on the scenarios you created; you can use it later to review the journey and create wireframes on top of each step.

#####Red routes Define red routes for your product and you’ll be able to identify, prioritise and eliminate any usability obstacles on key user journeys.

###Explore

#####Brainstorm & sketch Find a war room, fill it with markers and drinks, get together and sketch, discuss, vote, disrupt, have fun!

#####Wireframe Add some details and structure to your ideas, reuse patterns and create pages on top of your user flows so you'll not leave anything behind.

#####Prototype You can start creating paper prototypes and continuously iterate to more functional ones. Use sketches, HTML pages or static images, then just get some people and test.

###Communicate

#####IA Understand your users, your data structure and your channels. How can you organise your navigation and content in a clear and consistent way?

#####Language Follow your brand personality, keep in mind users' culture and language, the context of your product and make sure they understand you.

#####Accessibility You don’t need to add extra functionality or to duplicate any content. The key is simply to assess the requirements of those with different skills and limited devices.

###Create

#####UI elements Reuse elements and patterns, follow your style guidelines. Don't have one? Create your guidelines. Start small, then create pages.

#####Gestures So you have a swipe slider? Tell me more about pinch, drag, zoom, rotate, shake, six-inch smartphones, left-handed people, mouseover, kinect, motion detection...

#####Responsiveness Can I see it on my mobile? Oh wait, what about my smart-watch which works as a remote for my 50" TV? Bonus: remember cross device experience.

###Give feedback

#####Waiting times If your users have to wait ages for the page to load, at least show them a loader, if it takes longer why don't you try something more entertaining?

#####Errors Be clear and specific about what and where a user's error is. I mean your error, because if it's your fault you should say it.

#####Completed actions Give immediate and clear feedback of successful actions. Do not always wait for server response, trust your server once in a while!

###Finalise

#####Finalise layout It's time to let your design shine, make it in the right way, don't stop with the first solution, always ask "Is this the best I can do?"

#####Use of images and icons Use of icons and images is strongly influenced by context, culture and layout. Like icons, test your images, small changes can bring huge improvements.

#####Font & colours hierarchy Use colours and font sizes properly, try to follow your guidelines and keep it simple. The best visual hierarchies lead users to take the action confidently.

###Delight

#####Micro copy Every word is important, and a bit of personality will help your brand.

#####Micro interactions Trigger, rules, feedback, loop. Details make the product. Bonus: Ever heard about easter eggs?

#####Transitions Motion shouldn't be only beautiful, it should build meaning about the spatial relationships, functionality, and intention of the system.

###Analyse

#####KPI Setup What you want to achieve? What are your goals? Write down how you define success and failure and check if you have everything you need to collect the data.

#####AB Test plan Plan your A/B test ahead and, if you can, plan a short roadmap of improvements. Your goal is not just improving KPIs, but learning something.

#####Test UX lab, survey, sessions recording... Test, observe, and fix...test, observe, and fix...

uxchecklist.github.io's People

Contributors

sovesove avatar alefranz avatar robashcom avatar capito-tar-gz avatar

Watchers

Ray Lugo, Jr. avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.