15 essential tools for designers

18
1 www.metrostarsystems.com 15 ESSENTIAL TOOLS for Designers

Upload: debbie-peterson

Post on 12-Apr-2017

250 views

Category:

Design


1 download

TRANSCRIPT

Page 1: 15 essential tools for designers

1www.metrostarsystems.com

15 ESSENTIAL TOOLSfor Designers

Page 2: 15 essential tools for designers

2www.metrostarsystems.com

The Essentials ListWhether you are a UX Designer, Visual Designer, or Front-End Developer, these tools may help make your design/ development process a little easier.

Page 3: 15 essential tools for designers

3www.metrostarsystems.com

UX DESIGN & RESEARCHING TOOLSUsertesting.com

Usertesting.com allows you to recruit users and conduct unmoderated or moderated remote user tests. All of the tests are video recorded too so you can go back and analyze the results.

Page 4: 15 essential tools for designers

4www.metrostarsystems.com

UX DESIGN & RESEARCHING TOOLSGoogle Drive

Google Drive can be used to organize UX design and research. Google Drive’s cloud based tools (spreadsheets, whiteboards, and

file sharing) enable easy collaboration on projects.

Page 5: 15 essential tools for designers

5www.metrostarsystems.com

UX DESIGN & RESEARCHING TOOLSSketch

While Sketch is an amazing tool for creating visual designs, it can also be used for UX design. There are plenty of tools designed specifically for wire framing or sitemaps, but Sketch makes it

simple to create wireframes and hand them off to a visual designer.

Page 6: 15 essential tools for designers

6www.metrostarsystems.com

UX DESIGN & RESEARCHING TOOLSInVision

InVision is a simple prototyping tool that allows you to take mockups or wireframes and turn them into clickable pages. The

clickable prototype can then be used to show developers interactions or user test the prototype.

Page 7: 15 essential tools for designers

7www.metrostarsystems.com

UX DESIGN & RESEARCHING TOOLSProto.io

Proto.io is a prototyping tool with the ability to do advanced animations. If you need to test or show advanced features such as

scrolling and swiping then this is the tool to use.

Page 8: 15 essential tools for designers

8www.metrostarsystems.com

UI/VISUAL DESIGN TOOLSAdobe Color CC

Adobe Color is a great tool for creating your own custom color palettes or browsing through palettes already made by people in

the Adobe community.

Page 9: 15 essential tools for designers

9www.metrostarsystems.com

UI/VISUAL DESIGN TOOLSSubtle Patterns

Subtle Patterns is a tool you can use to browse through free patterns created by other designers. These are great to use for background patterns in headers and other sections of sites and

apps.

Page 10: 15 essential tools for designers

10www.metrostarsystems.com

UI/VISUAL DESIGN TOOLSSite Inspire

If you need inspiration to help you get started on your visual designs then head over to Site Inspire. You can filter for specific categories and find inspiration from sites with similar content.

Page 11: 15 essential tools for designers

11www.metrostarsystems.com

UI/VISUAL DESIGN TOOLSPttrns.com

If you are working on a mobile design and need some inspiration for user interaction then Pttrns is the perfect site to go to. You can

search or filter based on the UI element you want to design.

Page 12: 15 essential tools for designers

12www.metrostarsystems.com

UI/VISUAL DESIGN TOOLIconFinder

Iconfinder is used to find millions of free or paid for icons to use in your product design. It can also be used to get some inspiration

from other icons.

Page 13: 15 essential tools for designers

13www.metrostarsystems.com

UI/VISUAL DESIGN TOOLSPexels

Pexels has amazing royalty free stock photos. They are perfect to use in beginning mockups or in your final design.

Page 14: 15 essential tools for designers

14www.metrostarsystems.com

OTHER RESOURCES/TOOLSDesign Details Podcast

Design Details is described as “A show about the people who design our favorite products.” The episodes teach new processes and resources from leaders in the design world who share their journeys in the design field and how to progress in your career.

Page 15: 15 essential tools for designers

15www.metrostarsystems.com

OTHER RESOURCES/TOOLSCodeacademy

Codecademy is a free resource to help you learn to code. It’s useful for beginners wanting to learn the basics and for more

advanced developers looking to advance their skills or see examples from the community.

Page 16: 15 essential tools for designers

16www.metrostarsystems.com

OTHER RESOURCES/TOOLSLynda

Lynda is a website to learn software, creative techniques, and many other professional skills. It has hundreds of courses for UX designers, visual designers, and developers. If you are trying to

learn a new program this is a great place to start.

Page 17: 15 essential tools for designers

17www.metrostarsystems.com

OTHER RESOURCES/TOOLSZeplin

Zeplin is the perfect tool for collaboration between designers and developers. Zeplin provides plugins for Sketch and Photoshop for designers to easily export screens right to Zeplin. The developer then has assets and CSS needed to develop the site or product

perfectly.

Page 18: 15 essential tools for designers

18www.metrostarsystems.com

About our Digital Practice AreaLEARN MORE

703.481.9581

[email protected]