For every Junior Designer
By: Oreoluwanimi Adeyemi
Tags: UI, UX, Smashing Magazine, Product Design, Ui Ux Design

illustration from Ouch Illustrations

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

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

illustration from Greg Rog

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

Reading List

Don’t Make Me Think Revisited: A common sense approach to web usability – Steve Krug Ux design 2020: the ultimate beginner’s guide to user experience. -By Theo Farrington Ux for beginners: A crash course in 100 short lessons -By Joel Marsh User friendly How the hidden rules of design are changing the way we live, work and play-By Cliff Kuang and Robert Fabricant Refactoring UI- By Adam Wathan and Steve Schoger Ux design 2020: the ultimate beginner’s guide to user experience. -By Theo Farrington The design of everyday things — Donald A. Norman The Non-Designer’s Design Book — By Robin Williams The Elements of User Experience — By Jesse James Garrett A Project Guide to UX Design: For user experience designers in the field or in the making (2nd Edition) — By Russ Unger & Carolyn Chandler

Medium Articles

Because I’m a huge follower and fan of medium’s content for UI/UX, here are some great reads on design thinking, color, information architecture, etc

A guide to information architecture

The anatomy of a button

Enhance your UI with these typography tips

Typography can break or make your design..

A letter to a struggling UI/UX designer

To those new to design

Design Principles

6 Visual fundamentals that UX Designers should consider

Figma for learners

Basic UI color guide

Visual hierarchy

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 UXbooth 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.

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.

Now let’s gettinnnn

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 – Typewolf the absolute 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

Icons

The Noun Project – Over a million curated icons, created by a global community.

Flat Icon – 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

Inspiration

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

Dribble

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

Illustrations

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.

I hope you found this list helpful! Don’t forget to follow me here on Medium for more design-related content

🙋🏾‍♀️Reach out to me on Twitter or LinkedIn to say hello or get me a Tesla.