For every Junior Designer

A resource filled library for Designers

Hello👋, I decided to put together a plethora of resources that have helped me in my Product Design journey. Hope you find it helpful. Let’s get started!

What is UI/UX

What is UX

Illustration from Webit Factory

User interface (UI) design according to Emil Lampretch, is a purely digital practice. It considers all the visual, interactive elements of a product interface – including buttons, icons, spacing, typography, color schemes, and responsive design. On the other hand, User experience (UX) design is the process of developing and improving the quality of interaction between a user and all facets of a company.

To simplify:

A UI designer seeks to put out a visually appealing product; to make you open a screen and say ‘mad oo’ while a UX designer is concerned about how you feel using the product. For instance, the feeling you get from clicking a button multiple times and it doesn’t bring the desired result can be termed bad UX.

There are many roles within UI/UX, we have:

  • UX Consultant
  • UX Designers
  • UX Researcher
  • UX Analyst
  • UX Strategist
  • UI Designer
  • Information Architect
  • Interaction Designer
  • Visual Designer and so on

Tools and Resources

List of tools

Illustration from Webit Factory

There are quite a number of tools you can use to get started in UI/UX. However, you do not need to master them all. The required tool will be listed in the job description. There are:

  • Figma – Free with additional paid plans
  • Adobe XD – Free with additional paid plans
  • Sketch – Paid
  • Invision – Free
  • Framer – Free
  • Proto.io – $24 a month

Courses

These platforms provide courses that will introduce you to design process and supply all the information required as well as a certificate of completion which you can attach to your portfolio

  • Udemy – Paid
  • Interaction Design Foundation – Paid
  • Future Learn – Free
  • Coursera – Paid

YouTube Channels

Here are some channels that are the best when it comes to delivering rock-solid information on UI, UX, Freelancing, design process and selected tools

  • Flux – Ran Segall, a designer, shares his journey, struggles and lessons he learned as he builds his career as a designer and a business owner.
  • Design Code – Design reviews and techniques.
  • Design Course –Tutorials, experiments, crash courses and design review
  • Design Pilot – Design Process, tutorials, tips and resources.

Ux Websites and Blogs

  • Smashing Magazine – A comprehensive website provides high-quality articles with the UX employee on Design, Coding, Mobile, and WordPress,etc.
  • UX Booth – A professional UX website. The difference between it and Smashing Magazine is that it focuses more on the aspect of user experience design.
  • Invision Blog – It’s a blog with very simple and clean interface, no more distraction from advertisements or others. Articles are all surrounding the topics of design tools, UI/UX design, web design, and mobile app design. A good design topic resource to follow.
  • Invision Blog – It’s a blog with very simple and clean interface, no more distraction from advertisements or others. Articles are all surrounding the topics of design tools, UI/UX design, web design, and mobile app design. A good design topic resource to follow.
  • Toptal Designers Blog – A hub for in-depth design tutorials and coverage of new design trends, created by professional freelance designers in the Toptal network.
  • Design Modo – All-in-one solution to create website and newsletter design to impress and engage your customers.
  • The UX Collective – The UX Collective is an independent design publication built to elevate unheard design voices all over the world. Curated stories on user experience, visual and product
  • Design Shack – Design Shack is a daily source of helpful resources, articles, inspiration, tips, and tutorials for the design community.
  • Creative Bloq – Daily inspiration for creative people. Fresh thinking, expert tips and tutorials to supercharge your creative muscles.

Fonts

  • Font Squirrel – Free, hand-picked, high-quality, commercial-use fonts
  • Google Fonts – Google Fonts makes product and web pages run faster by safely caching fonts without compromising users’ privacy or security.
  • Dafont – Free fonts to download.
  • Typewolf – The best resource available for everything related to typography on the web.
  • Identify Font – Identify a font by answering questions about key features
  • WhatTheFont – Seen a font in use and want to know what it is? This is your guy.

Icons

  • The Noun Project – Over a million curated icons, created by a global community.
  • Flat Icon – G The largest database of free icons available in PNG, SVG, EPS, PSD and BASE 64 formats.
  • Icons8 – Free Icons by First-Class Designers.
  • Iconscout
  • Feather icons

Inspirations

  • Muzli – The best design inspiration expertly curated for you.
  • Design Munk
  • Lapa.ninja
  • Collectui.com
  • UI Parade – UI Inspirations.
  • UI Patterns – User Interface Design patterns are recurring solutions that solve common design problems.
  • Behance
  • Dribbble
  • Uijar
  • Minimal Gallery

Stock Photos

  • Pexels – Best free stock photos in one place.
  • Pixabay – Pixabay is a vibrant community of creatives, sharing copyright free images and videos.
  • StockSnap – Hundreds of high-resolution images added weekly.
  • Unsplash – Beautiful, free photos. Gifted by the world’s most generous community of photographers.
  • Bantu Photos

Vectors and Graphics

  • Free Vector – A world of free vector art at your fingertips!
  • Vecteezy – Discover & download free vector Art!
  • Freepik – A world of free vector art at your fingertips

Colors

  • Assessible Colors
  • Graphic Style Manual for Understanding How Color Affects Design – Color is an integral part of any design solution. Design Elements, Color Fundamentals is an essential resource for designers who want to create a memorable design and successfully communicate with their audience.
  • Coolors – Generate or browse beautiful color combinations for your designs.
  • Color Combination
  • Color Inspo
  • Color hunt
  • Material Palette

Illustration

  • Undraw
  • Undrawkit.
  • Illustration.co
  • Manypixels.co
  • Humaaans.com
  • Black illustrations

Mock-ups

  • Mockupworld
  • Is.graphics
  • Graphicburger
  • Free design resources

Wireframing

  • Flowmapp
  • Mockflow
  • Mockplus
  • Figma
  • Wireframe.cc

Podcasts

  • Design matters Podcast by Debbie Millman
  • UI Breakfast Podcast
  • The Futur Podcast

Additional Resources

  • Daily UI – A 100 day of practicing UI that will help you to boost your UI skills
  • Whimsical –Whimsical is a unified suite of collaboration tools. Great for product specs, wikis, brainstorming, ideation, user flows, architecture diagrams and more.
Back to writings