Library

A collection of free resources to learn graphic and web design

screen-shot-2016-11-18-at-22-12-33

MarkSheet

A free HTML&CSS tutorial

screen-shot-2016-11-12-at-17-46-51

Typography Tutorial – 10 rules to help you rule type

Graphic Design Tutorial: 10 Typography rules to help you improve your type skills. Get better at graphic design by understanding how to use type. Improve your layouts instantly by following these 10 easy to follow rules.

screen-shot-2016-10-29-at-22-43-52

Letterpress Printing and Poster Design

Sometimes the best designs start offline — where there's no Cmd+Z. Handcrafted poster design with letterpress by Dirk Fowler.

screen-shot-2016-10-29-at-22-34-08

Graphic design can change your life

Erik Spiekermann talking with Gestalten TV about the process of designing typefaces.

screen-shot-2016-10-04-at-14-54-57

Type Terms

The animated typographic cheat sheet. If you are new to typography or here to refresh your memory, then Type Terms is the perfect tool for you.

Screen Shot 2015-11-10 at 01.49.19

Typography 101

It is senior project of Bilkent University, Graphic Design department. 3.40 minute brief explanation of typography

Screen Shot 2015-11-05 at 01.17.02

Sketch 3 Tutorials

Sketch is a very promising designer tool, that has got a lot of traction lately and here is great free tutorial to learn it from scratch.

khan-academy-logo

Intro to HTML/CSS: Making webpages

Learn how to use HTML and CSS to make webpages with this high quality video course from Khan Academy

apple-touch-icon-precomposed

Colour Code

colourco.de is an online designer tool, which allows you to easily and intuitively combine colours

Screen Shot 2015-09-24 at 14.32.17

UX Crash Course

31 lessons crash course in UX, from Joel Marsh, experience architect.

html5-logo

Learn the Foundations of HTML

HTML tutorial from Udemy blog, nice and simple introduction into coding with HTML&CSS

Screen Shot 2015-04-18 at 12.29.29

A23D

The story of the birth of the worlds first uniquely designed, 3D printed Letterpress font

Screen Shot 2015-03-12 at 13.56.01

Design Principles: The Philosophy of UX

A set of guiding principles for experience design in a nicely put slideshare presentation from Whitney Hess.

aquent

Aquent Gymnasium

Aquent Gymnasium is a free online school with great set of courses sponsored by Aquent. Platform is nicely designed with good quality video content.

Screen Shot 2015-01-29 at 15.00.31

The UX Reader

This ebook is a collection of the most popular articles from UX Newsletter by Mailchimp, along with some exclusive content.

HACKDESIGN

Hack Design

An easy to follow design course for people who do amazing things. Receive a design lesson in your inbox each week, hand crafted by a design pro.

Screen Shot 2014-12-30 at 04.01.51

Wilson Miner – When We Build

What happens when we stop thinking of ourselves not just as developers or experience designers, and take up the mantle as a new generation of product designers for a digital world?

type-scale

Type Scale

A visual browser based tool to set the typographical scale with ability to export CSS

pencil-project

Pencil Project

An open-source GUI prototyping tool that's available for ALL platforms.

Screen Shot 2014-12-04 at 14.44.58

Font Combinator

This tool has been built to allow previewing of font combinations in a fast, browser-based manner.

Screen Shot 2014-12-04 at 14.38.17

Typewonder

Try any google font on any site in seconds!

gridlover

Gridlover

The tool to establish a typographic system
with modular scale and vertical rhythm.

Screen Shot 2014-12-02 at 17.32.51

BBC Gel

The GEL guidelines are a reference point for designing BBC services across Web, Mobile, iPTV and Tablet.

Screen Shot 2014-12-02 at 17.20.46

Government Service Design Manual

Discover what it means to be part of an agile, user-focused and multidisciplinary team, delivering digital services in government (gov.uk).

Screen Shot 2014-12-02 at 17.05.14

Wireframe.cc

Free and very minimal wireframing tool inside your browser

Screen Shot 2014-12-02 at 16.27.32

The Fundamentals of User Experience

Amanda Morrow, Interactive Designer at BitMethod and Lead Designer of Change, introduced some of the basics of user experience design. She began by defining the term, then walking through the general process of UX design and all its elements. She then ended with a few tips for making better design decisions.

Screen Shot 2014-12-02 at 15.43.42

UI / UX DESIGN PROCESS

Super short but great insight of the design process in the 'Awesome' design team from NYC

Screen Shot 2014-12-02 at 15.29.22

Explain IA

Short video by Dan Klyn explaining what is information architecture.

illustration_what

Style Tiles

Style Tiles are a design deliverable consisting of fonts, colors and interface elements that communicate the essence of a visual brand for the web.

16

Designing for the Web

Designing for the web is different than designing for any other medium. The breadth of skills required is sometimes daunting. The depth of experience required, seemingly unobtainable. Yet, the medium attracts designers from all spheres of design practice: from engineering and architecture, to product and graphic design.

fontology

Fontology

It is a guide in the use of type – for students, educators and professional designers.

shapes

Building unimaginable shapes

Inspired by cell division, Michael Hansmeyer writes algorithms that design outrageously fascinating shapes and forms with millions of facets.

Screen Shot 2014-11-07 at 14.42.34

The Magic of CSS

Online text-book/course about the magic of CSS for intermediate-to-advanced level.

Screen Shot 2014-11-06 at 16.00.43

Meet Your Type

A field guide to love & typography. Great free PDF book about typography from FontShop.

Screen Shot 2014-11-06 at 00.37.52

PIXEL PERFECT PRECISION

A comprehensive handbook on digital design covering much of USTWO agency's collective knowledge and process.

9fc7e70d_o

coolors.co

The super fast colour palettes generator

1st_digital_camera

Inventor Portrait: Steven Sasson

Great short video about the first digital camera and its inventor.

11166506_800

Press Pause Play

The digital revolution of the last decade has unleashed creativity and talent in an unprecedented way, with unlimited opportunities. But does democratized culture mean better art or is true talent instead drowned out? This is the question addressed by PressPausePlay

ux_axioms

UX Axioms

A set of UX Axioms designers and developers alike can use to integrate UX into their practice.

ux_podcast

UX Podcast

UX Podcast is for people passionate about balancing business, technology and users within the realm of digital media.

Screen Shot 2014-08-02 at 14.46.54

Milton Glaser: Using design to make ideas new

From the TED archives: The legendary graphic designer Milton Glaser dives deep into a new painting inspired by Piero della Francesca. From here, he muses on what makes a convincing poster, by breaking down an idea and making it new.

Screen Shot 2014-08-01 at 20.00.21

The Adobe Illustrator Story

Great documentary about the history of Adobe Illustrator (first shipped in 1987) told by it's creators.

type_connection

Type Connection

Type Connection is a game that helps you learn how to pair typefaces.

responsive_emails

Responsive Email Patterns

A collection of patterns & modules for responsive emails

discover_typography

Discover Typography

Great way to discover fonts by Hoefler & Co

The_Fundamental_Elements_of_Design_on_Vimeo_-_2014-05-17_16.31.25

The Fundamental Elements of Design

Short video about 6 fundamentals of design in action: balance, proximity, alignment, repetition, contrast and space.

unheap

Unheap

A tidy repository of jQuery plugins

my_life_in_typefaces

My life in typefaces

In this charming talk, Matthew Carter, the man behind typefaces such as Verdana, Georgia and Bell Centennial, takes us on a spin through a career focused on the very last pixel of each letter of a font.

kooler2

Adobe Kooler

Create colour schemes with the colour wheel or browse thousands of colour combinations from the Kuler community.

information

Information

Although most of us think we know what we mean when we say "information," we sometimes confuse the medium with the message.

letterpress

Upside Down, Left To Right: A Letterpress Film

A short film about letterpress and one of the few remaining movable-type printing workshops in the UK, situated at Plymouth University, featuring Paul Collier.

ron_resch

Paper and Stick

The Ron Resch Paper and Stick film is a great short movie about creativity, persistence and the amazing things you could do on a computer in the 60s.

responsive

This Is Responsive

Patterns, resources and news for creating responsive web experiences.

typographic_style_web

The Elements of Typographic Style Applied to the Web

A practical guide to web typography

gettingRealCover

Getting Real

Want to build a successful web app? Then it's time to Get Real. Getting Real is a smaller, faster, better way to build software.

codeacademy_html&css

HTML & CSS

Learn the building blocks of web development with HTML and CSS, and create your own website by the end of the course.

Photoshop_Etiquette

Photoshop Etiquette

A Guide to Discernible Web Design in Photoshop

Don’t_Fear_the_Internet

Don’t Fear the Internet

Basic HTML&CSS video guide for non-web designers

history_of_typography

The History of Typography

A paper-letter animation about the history of fonts and typography.

I_m_Comic_Sans

I’m Comic Sans, Asshole

A short monologue from the perspective of the typeface comic sans.

Comic_Sans_on_Vimeo

Comic Sans

A short documentary about the font Comic Sans. Created for a video production course and inspired by the film "Helvetica" by Gary Hustwit.

practical_typography.jpg

Practical Typography

This book is part­ly an ex­per­i­ment in tak­ing the web se­ri­ous­ly as a book-pub­lish­ing medi­um.

thinking_with_type

Thinking with Type

Type is the foundation of print and web design. Everything you need to know about thinking with type, you will find here.

color-game

Color

A game that will help you understand color properties and harmonies

shapetype

Shape Type

Learn how to manipulate bézier curves and get a typography lesson at the same time

kerntype

Kern Type

A game that will help you understand letter spacing and kerning