UIxD CLASS RESOURCES

A mix of old and new… Contact me to add yours!

 

CODING ASSETS

Emmet Cheat Sheet
Emmet short cuts

CodeMyUI
Web Design and UI Inspiration with code

ScrollJacking Demo
Full vertical height section scrolling

Lightbox 2 
Modal photo gallery

CSS Hovers
Simple hover effects in CSS

Animate CSS 
Simple CSS Animations

CSS Image Hovers
Really cool image hovers

CSS Reset
Meyer Web Reset browser

Flexbox Froggy
A game to learn flexbox

USER INTERFACE KITS

Wires for XD
Blue wireframes for desktop and mobile

Apple
Apple’s UI Kits all apps

Material Design
Visual system by Google/Android

Denali
Yahoo!’s design system

APPS / TOOLS

Way Back Machine
Historical reference of websites

SublimeText
Code Editor used for class

Invinsion
Prototyping/Design tools

Coggle
Mapping and flow tool – web based

Gloomaps
Site map maker – web based

InVision Studio
Design App for UX/UI. Great animations

Protopie
Interactive prototyping tool

Figma
Interactive Design and Prototyping

Sketch
Prototype App – The industry standard for now…

Balsamiq
Wireframes fast and easy

SITE REFERENCE / NEW + VINTAGE

Jess and Russ
Parallax scroll effect

Background Videos
Examples of background videos

The Wilderness Downton 
Arcade Fire, Chris Milk, Aaron Koblin interactive music video

WEBsite builders / cms

Webflow
As of 2020 – this is it

SquareSpace 
Website builder

Wix
Website Builder

Shopify
Shopping Site Builder

HOSTING / DOMAINS

Dreamhost
LA Based – I use them

Mediatemple
Higher end, GoDaddy owned

GoDaddy
Cheap, but read between the lines. Get ready for spam.

Bluehost
Cheap, not bad from my experience

Hover
Domain name purchasing. Use my code.

AGENCIES / STUDIOS

Huge
Digital Agency

IDEO
Industry and thought leaders

TYPOGRAPHY

Google Fonts
Library of web fonts free

FontAwesome
somewhat free icon library

CREATIVE PROCESS

Moodzer
Moodboard maker

Styletiles
Write up and samples of style tiles

A Guide to Personas
Medium article on crafting personas

User Persona Helper
Templates for user personas

COLOR

Colour Lovers
Color palette helper

Adobe Color
Color palette helper

STOCK ASSETS

Unsplash
Free stock photos

MixKit
Free video clips, music, templates etc.

Humaans Illustrations
People Illustration Maker

Pexels
Free stock photo/video

 

ARTICLES / RESOURCES

Prototypr
News, Tools, Resources, Articles and more!

A List Apart
Critical writings and resources

Microinteractions
What, why, when…

Atomic Design
Interactive design visual systems

Invision – Inside Design
Inside Design articles

Design Better
Invision’s Design Insight resource site

UX Myths
A collection of UX Design myths

UX Booth
Articles and resources on UX Careers

UX vs UI vs IA
An article that hopes to explain/define some terms

Smashing Magazine
Relevant articles on UX and Web Design

DESIGN INSPIRATION

Awwwards
Community voted website gallery

Dribbble Web Design
Web Design Category/tag

Behance
Searchable Portfolio Work

Designsperation
Searchable/filterable creative work

One Page Love
Single Page/Landing page gallery

Savee.it
Inspiration aggregator

Typewolf
Trending in type

Styleguides.io
Library of company branding style guides

The Brand New 
Branding case studies – great writing resource

TUTORIALS

XD Quick Start
XD Tutorials from Adobe

Design Sprint Kit
Google’s kit to run a sprint

PORTFOLIOS

Cofolios
Intern portfolio site

mindisplay.com
My old student work website

LatinxWhoDesign.com
What is says..