A UI designer’s toolkit


Figma

A popular cloud-based design tool that supports real-time collaboration. Used for user interface design and prototyping.

https://www.figma.com/

Adobe XD

Adobe’s own tool focused on user interface design and building prototypes.

https://adobexdplatform.com/

Principle

A tool to create micro-animations and interactive prototypes to demonstrate how user interfaces work.

https://principleformac.com/

Adobe Illustrator

A design tool that is particularly useful for creating icons and vector-based graphics for user interfaces.

https://www.adobe.com/fi/products/illustrator.html

UserTesting

Used to collect direct feedback from users on the functionality of the plans.

https://www.usertesting.com/

Lookback

A tool for user testing that can save data and videos obtained during user tests.

https://www.lookback.com/

Maze

An analytics and user testing tool that can be used to test prototypes and gather information about the functionality of the design.

https://maze.co/

Storybook

A tool used to develop and document components in design systems.

https://storybook.js.org/

Coolors

A tool for creating color palettes to help you choose compatible colors.

https://coolors.co/

Google Fonts

Freely available extensive library of fonts suitable for web styles.

https://fonts.google.com/

TypeScale

A tool for creating a typography scale for web pages and user interfaces.

https://typescale.com/

Zeppelin

A tool used for collaboration between developers and designers. It helps to transfer designs directly to code.

https://zeplin.io/

Notion

A multipurpose collaboration and documentation tool for team communication and task management.

https://www.notion.so/

 

These tools help the user interface designer to create visually appealing, functional and user-friendly user interfaces and to collaborate closely with the team and customers.



Janne Gylling
Creative Director • janne@jannegylling.fi