Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.
Awesome Lists | Featured Topics | Projects
https://github.com/mafda/ux_tools

A brief introduction to User Experience - UX. A list of the main UX tools and methods: Strategy, Ideas, Planning, Validation, Design, Metrics, and Launch!
https://github.com/mafda/ux_tools
ux ux-design ux-methods ux-tools
Last synced: 1 day ago
JSON representation
A brief introduction to User Experience - UX. A list of the main UX tools and methods: Strategy, Ideas, Planning, Validation, Design, Metrics, and Launch!
Host: GitHub
URL: https://github.com/mafda/ux_tools
Owner: mafda
License: mit
Created: 2020-06-20T13:55:51.000Z (over 4 years ago)
Default Branch: master
Last Pushed: 2020-09-17T20:59:43.000Z (over 4 years ago)
Last Synced: 2024-11-16T12:13:01.249Z (2 months ago)
Topics: ux, ux-design, ux-methods, ux-tools
Homepage:
Size: 120 KB
Stars: 3
Watchers: 2
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project

README

        **Table of Contents**

- [UX - User Experience](#ux---user-experience)

  - [Differences between UI and UX](#differences-between-ui-and-ux)

  - [UX Tools](#ux-tools)

  - [UX Tools and Methods](#ux-tools-and-methods)

    - [1. Product strategy](#1-product-strategy)

    - [2. Ideas Generation](#2-ideas-generation)

    - [3. Planning and Development](#3-planning-and-development)

    - [4. Validation and Research](#4-validation-and-research)

    - [5. Interface Design](#5-interface-design)

    - [6. Success Metrics](#6-success-metrics)

    - [7. Launch MVP](#7-launch-mvp)

  - [More interesting tools](#more-interesting-tools)

  - [More interesting links](#more-interesting-links)

  - [UX checklist](#ux-checklist)

  - [Other repositories](#other-repositories)

  - [Reference](#reference)

# UX - User Experience

User Experience - **UX** occurs when the **user** comes into **contact** with a **product**.

* How to **listen** to the user and **extract** needs?

* How to **create** products that people need?

  

## Differences between UI and UX

| UI - User Interface                                                                              | UX - User Experience                                                                                                                |

| :----------------------------------------------------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------- |

| What the user finds and sees when they arrive at a website or app                                | Focuses on what the user perceives of the website or app                                                                            |

| Everything that allows you to interact with the website or app, from buttons to forms            | Focuses on whether the content was useful, whether the navigation was enriching, and whether it was easily manageable and intuitive |

| Ensures that the website or app looks good and works well on all platforms: mobile, web, tablets | Includes target research, psychology, design, and marketing                                                                         |

## UX Tools

UX tools are essential because you have got to have a **wide range of options** to help you create the things you need.

## UX Tools and Methods

![ux_tools_by_mafda](img/ux_tools_by_mafda.png)

### 1. Product strategy

How to **discover** and **create** what people need.

* [Blueprints](https://medium.com/@cynthiarisse/service-blueprinting-69ce8fd0509)

* [Customer Journey Map](https://medium.com/@uxmastery/how-to-create-a-customer-journey-map-42e6ac7d8757)

* [Ecosystem](https://www.uxbooth.com/articles/designing-digital-strategies-part-1-cartography/)

* [Golden Path](https://medium.com/startup-by-design/goldenpath-156c1ff291ab)

* [Future Press Release](https://uxdesign.cc/a-press-release-before-ux-design-df250539c974)

* [Personas](https://medium.com/beakerandflint/personas-74c4e1c12ee2)

* [Value Proposition](https://medium.muz.li/ux-diary-6-value-proposition-af7be6f79139)

* [Value Proposition Canvas](https://medium.com/greater-than-experience-design/whats-your-value-proposition-3de5eee48cf0)

* [Lightning Talks](https://medium.com/googlesprint/design-challenge-78ef1dcad26e)

* [Pixar Storytelling](https://uxdesign.cc/treating-your-product-design-work-like-its-a-pixar-movie-7c1a0fe62491)

* [Stakeholders Map](https://uxdesign.cc/presenting-your-design-to-stakeholders-1695526a1457)

* [Business Model Canvas](https://medium.com/@fernandocomet/ux-canvas-compilation-6718822d9a22)

* [First Tweet](https://medium.com/googlesprint/the-define-stage-stage-2-24f6b8088426)

* [Benchmark](https://measuringu.com/benchmark-intro/)

* [Metrics](https://medium.com/@jcoronado1/quick-resource-guide-to-ux-metrics-a97cf7727b2b)

### 2. Ideas Generation

How to **externalize** and **communicate** what you have in mind.

* [Double Diamond](https://medium.com/design-leadership-notebook/the-new-double-diamond-design-process-7c8f12d7945e)

* [Storyboard](https://medium.com/thinking-design/the-what-why-when-of-storyboarding-in-ux-design-38db2f955e23)

* [How Might We?](https://medium.com/knowsi/hmw-how-might-we-c04423a4437d)

* [Crazy 8's](https://blog.prototypr.io/how-to-run-a-crazy-eights-workshop-60d0a67b29a)

* [User Flow](https://medium.com/7bits/user-flow-101-what-it-is-how-to-do-it-84052141fe86)

* [Moodboard](https://www.webdesignerdepot.com/2008/12/why-mood-boards-matter/)

* [Taxonomy](http://johnnyholland.org/2012/04/taxonomy-content-strategys-new-best-friend/)

* [Design Principles](https://medium.com/googlesprint/the-define-stage-stage-2-24f6b8088426)

* [Sitemap](https://uxmentor.me/sitemaps-the-beginners-guide/)

  

### 3. Planning and Development

How to **execute** good ideas.

* [User Stories](https://uxdesign.cc/better-stories-with-job-story-3467de354f45)

* [Roadmap](https://uxdesign.cc/developing-a-product-roadmap-a62bc5f1a15b)

* [Job Story](https://jtbd.info/5-tips-for-writing-a-job-story-7c9092911fc9)

* [Project Model Canvas](https://medium.com/bigcommerce-developer-blog/using-an-experience-canvas-to-determine-your-next-feature-1e97c7e76388)

### 4. Validation and Research

How to **evaluate** the solution of the problems and **improve** the product.

* [Heuristic Analysis](https://www.usabilityfirst.com/usability-methods/heuristic-evaluation/)

* [Diary Studies](https://medium.com/user-research/user-research-weekly-9-diary-studies-e53d9312b485)

* [Quantitative and Qualitative Research](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e)

* [Landing Page](https://medium.com/@distillerytech/how-to-design-an-effective-landing-page-e9bffaccfdc5)

* [A/B Test](https://medium.com/intent-media-design/the-art-of-the-a-b-test-statistics-101-for-ux-designers-ux-researchers-780229e1e378)

* [Content Audit](https://uxmastery.com/how-to-conduct-a-content-audit/)

* [Focus Group](https://medium.com/pminsider/how-to-lead-ux-research-focus-groups-8d5cb960ad3e)

* [Card Sorting](https://medium.com/@yangchen/card-sorting-a-simple-and-effective-ux-research-tool-74befc3ef4ef)

* [Accessibility Analysis](https://medium.com/salesforce-ux/7-things-every-designer-needs-to-know-about-accessibility-64f105f0881b)

* [User Feedback](https://uxdesign.cc/the-importance-of-user-feedback-20a773908325)

* [Usability Interviews](https://medium.com/@MentallyFriendly/usability-testing-101-939c83ffe565)

### 5. Interface Design

How to **transform** ideas into sketch, prototypes, and products. **Usability** and utility.

* [Sketch](https://www.smashingmagazine.com/2011/12/the-messy-art-of-ux-sketching/)

* [Prototypes](https://uxplanet.org/basics-of-prototyping-1a4106e12c0e)

* [Wireframes](https://medium.com/nyc-design/wireframing-f7ce9ee4e703)

* [Style Guides](https://uxdesign.cc/all-you-need-to-know-about-style-guide-9513ebf50b46)

* [Usability](https://medium.com/@ishan02016/role-of-usability-in-ux-design-d073a9295668)

* [Pattern Library](https://boagworld.com/design/pattern-library/)

### 6. Success Metrics

Objectively **evaluate** the results of the product.

* [KPI](https://medium.com/@yogeshmithoon/important-kpis-of-ux-design-b817a7f86d80) (Key Performance Metrics)

* [CTR](https://www.webfx.com/blog/marketing/whats-good-click-rate-ctr-industry/) (Click Through Rate)

* [NPS](https://uxdesign.cc/what-is-nps-and-why-you-should-know-how-it-works-88690f39b99f) (Net Promoter Score)

* [DAU](https://medium.com/sequoia-capital/selecting-the-right-user-metric-de95015aa38) (Daily Active Users)

* [Churn Rate](https://www.dtelepathy.com/blog/products/how-to-reduce-churn-with-ux)

* [LTV](https://medium.com/@ClrMobile/how-to-maximize-the-lifetime-value-of-your-mobile-app-users-b82e0c522f49) (Lifetime Value)

* [HEART](https://medium.com/@onix_systems/matters-of-the-heart-how-to-measure-ui-and-ux-design-b7f29b77a711) (Happiness, Engagement, Adoption, Retention, Task Success)

  

### 7. Launch MVP

How to launch the **MVP**. **Learn fast** and succeed.

* [MVP](https://blog.crisp.se/2016/01/25/henrikkniberg/making-sense-of-mvp) (Minimum Viable Product)

* [Concierge](https://medium.com/@mrjeremywells/the-design-concierge-d1ca2a415c0e)

* [Code Prototypes](https://medium.com/@sagarajkt/free-platforms-to-create-prototyping-for-apps-or-web-design-ca70e902f7e2)

* [Low, Medium, and High Fidelity Prototypes](http://designforuse.net/client-deliverables/how-to-choose-a-ux-prototyping-tool/)

## More interesting tools

(strategy)

* [UXpressia](https://uxpressia.com/) Visualize customer experience

and collaborate with your team.

* [FlowMapp](https://www.flowmapp.com/) Full stack UX platform.

* [Strategyzer](https://www.strategyzer.com/) Creators of the Business Model Canvas.

(ideas)

* [MoodBoard](http://www.gomoodboard.com/) Build beautiful, simple, free moodboards.

* [Miro](https://miro.com/) Be Creative. Be Productive. From Anywhere.

* [overflow](https://overflow.io/) Create interactive user flow diagrams that tell a story.

   

(planning)

* [Trello](https://trello.com/) Keep track of everything.

* [Asana](https://asana.com/) Manage your team's work, projects, & tasks online.

* [Craft](https://craft.io/) Build intuitive Roadmaps, prioritize features, connect them with your dev teams.

(validation)

* [UXArmy](https://www.uxarmy.com/) Online usability testing platform.

* [UserTesting](https://www.usertesting.com/) Leader in user research and software testing.

* [Unbonce](https://unbounce.com/) Design Beautiful Landing Pages.

* [Klickpages](https://klickpages.com.br/) Tool for create landing pages.

* [OptimalSort](https://www.optimalworkshop.com/optimalsort/) Discover how people categorize information.

* [Optimizely](https://www.optimizely.com/) Best-known tool for A/B testing.

* [SurveyMonkey](https://www.surveymonkey.com/) Send and evaluate surveys quickly and easily.

(metrics)

* [UserZoom](https://www.userzoom.com/) Brands can test and measure UX on websites, apps, and prototypes.

* [Delighted](https://delighted.com/) Measure and evaluate qualitative metrics.

* [Hotjar](https://www.hotjar.com/) Website Heatmaps & Behavior Analytics Tools.

* [Google Analytics](https://analytics.google.com/analytics/web/) Measure ans track your  sites and applications.

(design and launch)

* [Axure](https://www.axure.com/) Powerful Prototyping and Developer.

* [Marvel](https://marvelapp.com/) Rapid prototyping, testing and handoff.

* [inVision](https://www.invisionapp.com/) Create rich interactive prototypes.

* [Framer](https://framer.com) Best prototyping tool for teams.

* [Flinto](https://www.flinto.com) Create interactive and animated prototypes.

* [Principle](http://principleformac.com) Design animated and interactive user interfaces.

* [JustInMind](https://www.justinmind.com) From wireframes to highly interactive prototypes.

## More interesting links

* [uxtools](https://uxtools.co/)

* [The 2020 UX Research Tools Map](https://www.userinterviews.com/blog/ux-research-tools-map-2020)

* [UX Design Methods In A Mind Map](https://uxplanet.org/product-design-methods-mind-map-f6511820a7d5)

* [UX Design Methods & Deliverables](https://uxdesign.cc/ux-design-methods-deliverables-657f54ce3c7d)

* [The Basic Principles of UX Design](https://medium.com/@riesdiansyah_64327/the-principles-of-ux-design-561c3a759e79)

* [How to Choose the Right UX Metrics for Your Product](https://www.dtelepathy.com/ux-metrics/)

* [Curated list for UI/UX Designers](https://github.com/gregjw/ui-ux)

* [UX_UI](https://github.com/alexUXUI/UX_UI)

## UX checklist

* [Checklist Design](https://www.checklist.design/) A collection of the best UX and UI practices.

* [UX Project Checklist](https://uxchecklist.github.io/) Methods and methodologies, activities and tools.

## Other repositories

* [Lean UX](https://github.com/mafda/ux_lean)

* [Design Sprint](https://github.com/mafda/ux_design_sprint)

## Reference

* [UX & Design Thinking: Experiência do Usuário nos negócios](https://www.udemy.com/course/ux-design/)

* [UX — User Experience Tools](https://medium.com/@mafda_/ux-user-experience-tools-dcf48ba88797)

* [Flowchart](https://whimsical.com/)

---

made with 💙 by [mafda](https://mafda.github.io/)