Welcome

Hello World

Week0

Welcome to HackDesign! Lesson 0 will prepare you for the lessons you'll start to receive every week, which will guide you towards design literacy and proficiency. Excited? This week, it's just one link. It happens to be the most powerful design resource I am personally aware of, and I'm excited to share it with you...

Read more

Introduction

Week1

Why design? What purpose does it serve? It's not purely aesthetic, nor wholly analytical and functional. When considering the design of your projects, you must think about how everything fits together in harmony - some would call this a holistic approach, but it's really the only practical way to approach design problems, as I see it...

Read more

Dive Into Typography

Week2

In this lesson, we'll dive right in and learn a few quick – but really important – rules about typography. Before we start the course, let's define typography quickly. Typography can simply be described as the art of type. It's everything you can think of – like fonts, sizes, and readability...

Read more

The Amazing New Mobile Web

Week3

It's no surprise that the amount of people browsing the web on a mobile device is speeding past desktop usage with no sign of slowing down. More and more people are getting their hands on a pocket sized device that is connected to the internet every minute. Designing for this split landscape of mobile and desktop to bring the user the best possible experience is an absolute must...

Read more

Know Your Tools

Week4

The phrase "a poor workman always blames his tools" has always bugged me — poor tools hinder the quality of your work. Great workers blame their tools too! If they're not performing, they should be blamed. You simply can't do your best work without amazing tools and the skills to wield them well. Great tools let us do the impractical and the impossible. They give us super powers...

Read more

Typography

Typography in Product Design

Week5

A few weeks ago we were introduced to the art of type, and gained a basic understanding of the rules surrounding it. But where does it all fit in? Of what value is typography to the interfaces we interact with on a regular basis? We put extreme emphasis into the code and pixels pertaining to our products. But both are rendered useless without the content...

Read more

Exploring the World of Typefaces

Week6

When we look back at black and white movies, we marvel at the results they could achieve without color. Despite this, we can agree color film was a good invention: you can still shoot in black and white, but color gives an extra dimension and opens up a lot of new avenues for those who want to use it...

Read more

Week7

Typography has always been at the foundation of design & communication. We're at an interesting point in time where we're being given previously unknown amounts of control over our work, but also new & scary challenges as we try to adapt to an ever-changing sea of devices and contexts...

Read more

Week8

The goal of this last lesson in typography is to provide a wide-angle view of this fascinating field, and highlight resources from some of its best practitioners to direct you as you continue your studies beyond this course...

Read more

User experience

Week9

It took our industry a number of years to fully understand how important user experience (UX) is to everything that we build. Now that we can measure and confirm the relationship between good UX and successful websites, UX skills are in high demand: PayScale shows a median wage of about $41k for web designers, $50k for web developers and $77k for user experience designers...

Read more

Week10

Rapid prototyping can mean the difference between quickly finding your path to a successful product and toiling away at a pipe-dream for months. Putting together a prototype will force you to think through the details and user experience of your product ideas. Once you have a prototype, you'll be able to show it to people and collect detailed feedback...

Read more

Defining & Expanding User Experience

Week11

Newton's 3rd Law says, "To every action there is always opposed an equal reaction". In my opinion this is the best way to describe an experience. Experiences ultimately define our lives. When we are young, we have no experiences thus our artifact is of little knowledge. When we are old, the opposite...

Read more

Week12

Effective user experience starts with a good understanding of your users. Not only do you want to know who they are, but you want to dive deeper into understanding their motivations, mentality, and behavior. This deep insight into your users will help you keep your product focused on delivering a great experience. But how do we know what our users really want?

Read more

User interface

Vector Interface Design

Week13

User Interface design plays a very important role as the translator in the communication between the user and the application's back-end or core functionality. It's purpose is to make the user feel comfortable interacting with and understanding your product. Most of a UI designer's job is spent thinking – the rest is executing the vision using the tools which work best for you...

Read more

Week14

Iconography is arguably the Esperanto of the digital world. Icons cannot replace the written word, yet they serve as cognitive waypoints for areas of interest and/or interaction. Iconography can also be an efficient way to communicate a concept in a small amount of space, which is increasingly important in the era of the shrinking screen...

Read more

Week15

Almost three years ago now, Ethan Marcotte introduced responsive web design. So far there were as many lovers as haters and many argued about the difference between responsiveness and native, mobile design. In the era of almost unlimited connectivity and wide variety of devices our designs can no longer be static, 960px wide layouts...

Read more

UI Design with Purpose

Week16

The purpose of UI design, above all else, is to deliver content and make visual sense of well planned out UX. The often debated battle between flat versus skeuomorphic design poses us a pivotal style decision in how we allow the content to communicate through our designs...

Read more

Graphic design principles

Building Color Confidence

Week17

Color is a powerful form of communication. We are so attracted to color and so repelled by it that even if the coolest design were presented to us, if we didn't like the color, we wouldn't like it at all. The objective of this lesson is to help build color confidence. This means being able to create harmonious and effective color combinations in our designs...

Read more

White Space: Designing the Invisible

Week18

No matter what visual style is hot, no matter what great product you're using, every piece of good design uses "white space" well...

Read more

Achieving Visual Hierarchy

Week19

One of the key principles of design is visual hierarchy, which encompasses almost everything you’ve learned on Hack Design so far. Whether you’re dealing with screen or print media, you have content—words and images—that needs to be organized into a layout. Visual hierarchy is the organization and prioritization of content as a means to communicate a message...

Read more

Week20

Design is (by nature) a subjective thing. It's also a team sport. When making design decisions about look or feel or content, disagreement is common and tensions can emerge. So how do you decide what "good" is for your product? Good design happens when a good user experience meets a solid brand identity...

Read more

Mobile

Designing your first iPhone App

Week21

It's undeniable that mobile devices have become a huge part of modern society. Similar to what the web did, iOS has revolutionized what digital products can be by giving them a home. The huge difference, however, are the two foundations. iOS is much different than the web in that it's able to provide a native home with a tightly controlled experience for it's applications...

Read more

Designing for Mobile Web

Week22

If we've entered any particular age or genre in web development, it's most likely that of accessibility. We can now view web pages on almost any device and, WiFi permitting, from almost anywhere in the world. What's even cooler is that we finally have the tools to make web pages usable, functional, and beautiful without designing entirely separate apps for the mobile experience...

Read more

Week23

There are a handful of special concepts that are important in mobile analytics, but most of the concepts people use in building out custom web analytics are very transferable to mobile app development. 4 of the 5 items below come from the general analytics or web analytics ecosystem – but I'll ask you to think about how they apply to your mobile app.

Read more

Using Icons in Interfaces

Week24

With the proliferation of mobile devices, icons play an increasingly important role in interface design. Icons can help aid in scannability, save space at smaller screen sizes, and afford clear, tappable targets. That said, icons can cause user confusion and frustration when used poorly...

Read more

Interaction design

Week25

The importance of user-centered design is well-established. This blunt statement from Dieter Rams says it all: "In my eyes, indifference towards people and the lives they lead is the only sin a designer can commit." But it's a significant challenge to translate high-level, human-centered concerns into the actual clicks and taps of a software product...

Read more

Content Strategy for Interfaces

Week26

The design of your idea – its simplicity, usability and ability to hook and delight people – is the reason your product could succeed when others fail. But design isn’t just about color swatches, logos or the placement of buttons and labels. It’s about creating an environment that tells people the story of your product and shows them how to use it...

Read more

Week27

Design is about an open and inspired way of working. It's about solving problems, and that's applicable to anyone, whether you're a CEO, graphic designer, middle school teacher, or MBA student. Abstracted from it's traditional graphic or industrial roots, design is now being applied to a wide variety of new spaces and pushing the bar of what many industries can achieve...

Read more

Effective Behavior Design

Week28

Part of designing a user experience is convincing the user to behave a certain way in order to reach a specific outcome. For example, right now I'm asking you to read articles, watch a video, and fill out a form to become better skilled at design. Behavior design gives us an organized and specific model to define and foster behavior change...

Read more

Cultivating Compassion

Week29

Being a great designer isn’t just about devising the best possible solution; it’s about making sure we’re solving the right problem. To do so, we need to hone our listening skills and deepen our capacity for empathy — both for our users and our colleagues. This requires being present, open-minded, caring, patient and accepting...

Read more

Front-end design

Designing with Code

Week30

Some designers are terrified of touching code and others simply prefer other tools...

Read more

It's All Just Systems Design

Week31

As someone who designs and codes, I find new similarities between visual design and programming every day. At Segment.io I work on all of our visual design, but also on our Javascript library and components. I've found the same principles to apply to both fields, and I think it's crucial for more programmer and designers to realize that...

Read more

Designing with Grids

Week32

The human brain has a penchant for identifying patterns, decoding them, then recoding them for later reuse. Not only does this cycle make it easier for us to understand the world around us, but it helps us constantly improve the tools we use to interact with it. Perhaps one of the most salient manifestions of this in the design world are grids...

Read more

Summer Vacation!

Week33

We hope you've been enjoying Hack Design so far! As we prepare to finish up the second half of the year, take this week to go back and complete any lessons you haven't finished yet. If you're all caught up, go you! Try hacking on a project this week and design something you couldn't possibly have made eight months ago...

Read more

Product design

Designing Quality Products

Week34

It's time to stop churning out software and start creating quality products. Ideas are a dime a dozen. Design and Development tools are advanced. Let's focus on what really matters. Great products begin and end with great design. Design should influence all product decisions. Even fundamental business questions like what to build, or how to sell it, should be treated as design decisions...

Read more

The Little Things Matter

Week35

As the bar for great design keeps getting higher and higher, having a keen attention to detail will help your products stand apart from the crowd. Your app should delight its users, whether that's through a beautifully executed feature, organic interface design, or even just having a bit of fun...

Read more

Week36

How do companies design experiences to repeatedly engage users? Designing for habits builds upon the principles of consumer psychology to create new routines. I've spent the past 2 years researching how products create habits and I've included a few articles to pique your interest. As you'll soon learn, the world is becoming a more persuasive, and potentially addictive place...

Read more

A Holistic Guide to Product Design

Week37

Product Design is the process of identifying a market opportunity, clearly defining the problem and then developing a robust solution to take to market. An effective Product Designer (in the software space) possesses multidisciplinary skills across business, user research, interaction design and visual design. Previous lessons focused in depth on some of the aforementioned disciplines...

Read more

Advanced user interface

Week38

When we talk about Animation and Direct Manipulation in interfaces they can often seem like completely disconnected concepts. You might explain direct manipulation as a user sliding a slider; or animation by showing a list updating by shifting around...

Read more

The Human Element

Week39

User interfaces consist of so much more than a series of mockups, typography choices or error states. The interactions that happen beyond the static are those that introduce life into your interface — enabling you to reward your users’ proficiency, increase positive emotions, and introduce new methods of interactivity that have permeated app design for years...

Read more

Week40

Recent shifts in mobile design means we must also shift our thinking. The use of motion and animation plays an essential part in conveying the personality of your work. Think of your favorite apps and Im sure you can pick out an interaction coupled with animation that makes each unique as well as adding function...

Read more

Week41

As motion and animations become more and more important in UI design, designers have started searching for the best tools to help them add a layer of interactivity to their work. You might have heard about After Effects, Quartz Composer or Xcode before in this context...

Read more

Advanced user experience

Week42

One thing product designers and companies must try their best to excel in, is the art of creating a product that is built with empathy. In doing so, you have the ability to create a great user experience. UX is more than just visual and interaction design. It’s in the way you market, engage users, simplify the ease of use with your product, customer service and more...

Read more

Designing With Your Ears

Week43

Design starts before you even draw your first sketch. As a designer, your goal is to impact people's life in a positive and meaningful way. But how to make sure your product will actually solve a real problem? How do you make sure your target audience will actually use it? Here are a few links that will help you build empathy for your user and teach you how to design with your ears.

Read more

Win The Internet With A/B Testing

Week44

Designing websites and building products for people is an exciting job. You get to use creativity and problem solving skills to create, in some cases, world-changing solutions. The most exciting part of this, however, is being able to run user-research sessions and A/B tests to see how your customers actually use your product...

Read more

Week45

These days it has become commonplace – if not necessary – for mobile apps to be designed across multiple platforms. Whether you’re starting from scratch or adapting an existing app to a new OS, the biggest challenge when designing for multiple platforms is balancing the consistency of branding and functionality with the conventions of individual platforms...

Read more

Context and Next Steps

Kickstarting Your Design Career

Week46

Formal design education is lacking in many areas, which means being proactive about your education in the beginning stages of your career will greatly benefit you when you step out into the real world. A solid body of work in your portfolio will get you noticed, but it's your soft skills, the aspects that are often pushed aside in favour of technical mastery, that will get you hired...

Read more

Week47

Last week, we examined a few different paths designers can take in their careers. Developing your soft skills—and gaining confidence in them—is essential in transitioning to the professional world of design...

Read more

Why Design?

Week48

“Questions are places in your mind where answers fit. If you haven’t asked the question, the answer has nowhere to go. It hits your mind and bounces right off. You have to ask the question – you have to want to know – in order to open up the space for the answer to fit.” – Clayton Christensen When learning, you must question before you can receive an answer...

Read more

Vim as a Design Tool

Week49

For many designers, editing and writing text comprises a large chunk of our work. Whether it's writing down ideas, editing code, or comprising an email, text-editing makes up a non-trivial part of our day. With this in mind we'll explore how and why we could use Vim, a command-based text editor, to improve our design workflow.

Read more

Week50

Being great at design is as much about knowing the theory as it is about knowing your own areas of growth as a designer. As the Hack Design course comes to a close with this last lesson, I want to point to a few resources that will help you understand yourself better as a designer. These are questions that, as designers, we have all asked ourselves at some point of time...

Read more

Coming up next...

Weeknext

New lessons every Monday!

We'll send you an email next Monday when the latest lesson is available. Even if you haven't finished a previous lesson, you'll still stay on track and up to date. Feel free to go back and complete tasks you missed from any previous lesson any time you want.