UX TOOLS

Praiz UX
PraizUx
Published in
3 min readMar 15, 2019

Looking for a tool to aid your design process could be pretty difficult most times.

I also had this difficulty looking for tools everyday in my designs process. Everyday new softwares are released to aid our UX Design process.

So, I’m always in between new tools and keeping up with old tools I’ve used before.

Besides, I love testing out new tools and I make a switch when the new tool has some cool features I can overwrite over the new one.

So, I’m breaking down the design process and the tools at each stage of the process.

Enjoy.

I’ll continually update whenever I discover new tools.

USER RESEARCH

The tools I listed here can be used for qualitative, quantitative, ethnographic research. Each of them different features you’ll find interesting.

  1. User Testing USER TESTING
  2. Ux Testing UX TESTING
  3. Lookback LOOKBACK
  4. Validately VALIDATELY
  5. User Zoom USER ZOOM
  6. Hot Jar HOT JAR

PERSONA

For persona i keep it simple with Xtensio because, i love the template they have designed for this. Other times, I may decide to use sketch, figma, xd to design the persona.

What remains key for me here is detailed information about each persona. Once I can pass this information clearly, I have done a perfect task.

WIREFRAMES & PROTOTYPING

Wireframes are either lo-fi or high fidelity. Whichever you decide to build first, any of these tools will help you achieve you.

  1. WHIMSICAL is perfect for lo-fi wireframes. I particularly like whimsical, because it has all the basic features you will need to design a wireframe. Anyone with zero design knowledge can use whimsical perfectly.
  2. BALSAMIQ is a very good tool for product managers/owners and anyone to design/sketch their wireframes. You apparently do not need any technical expertise to use this efficiently.
  3. WIREFRAME.CC I use this tool to design lo-fi wireframes / sketches.
  4. FIGMA I love figma because I can always my files anywhere at anytime on the web. So with figma, you can design online (with connection to the internet) and also with the application. Figma is one tool that can help you with lo-fi, high fidelity, animate and also prototype.
  5. SKETCH Sketch is a desktop application for Mac OS users. Once, you’ve it installed on your computer, you can fully utilize it for UI designs. I also love that I can export my designs to marvel directly from Sketch.
  6. ADOBE XD XD is a desktop application for designing and prototyping UI for web and mobile apps. I love that XD has a mobile app for android and ios users. The mobile app help you present your prototype.
  7. MARVEL Marvel helps me with prototyping. It is one I tool I enjoy using to prototype my mobile designs. You can export directly with sketch to marvel or you upload your designs after exporting them.
  8. INVISION I personally think is the best for achieving micro-interactions with your designs. However, design is relative to individuals. So, I will say whatever works best for you, stick to it. Invision also has a rich resource for design education. I spend quality time there learning and unlearning new tricks.

Information Architecture

  1. Real Time Board is the current tool I use for information architecture. I’m yet to discover a new tool for this.

User Journey/ Flow Maps

  1. Coogle helps with flow map
  2. Lucid chart, Draw.io
  3. Real time board can help you with Flow charts, Journey map and Information Architecture.

STORYBOARD

I use only Storyboard That: The World’s Best Free Online Storyboard Creator

CARD SORTING / TREE TESTING

1. OPTIMAL WORKSHOP

2. A white board.

3. USERZOOM

ICONS

Looking for icons? You can get SVG icons free here.

FLATICON

NOUN PROJECT

OTHER DESIGN RESOURCES

CASE STUDIES

PAGEFLOW

Evernote.Design: All in One Bookmark Links for Designer

LAPA NINJA

Mobbin — Latest Mobile Design Patterns

--

--