CommonLounge is a community of learners who learn together. Get started with the featured resources above, ask questions and discuss related stuff with everyone.
Project: Create User Personas for Commonlounge
In this project, you’ll be working with the Commonlounge team to help us create personas for our users. As you already know, Commonlounge (the platform you're on!) has courses with up-to-date, bite-sized lessons. We aim to deliver the most value for the time you invest in. You learn by working on real-world projects and getting feedback from industry mentors.
Given this, your task is to create detailed personas for Commonlounge users. Please refer to User Research and User Personas tutorial before getting started with this task.
Project: Create User Journey Maps for Commonlounge
In this project, you’ll be working with the Commonlounge team to help us create collect User Journey maps for our users.
In this project, you will pick a User Flow, break it down into as many stages as possible, interview 5 users go through the flow, and generate the User Journey maps for each of them. Please refer to Empathy Maps and User Journey Maps tutorial before getting started with this task.
Describe the user flow you picked and break it down into 5-10 stages. If you want an example, think of how a user who lands on a course page for the first time su...
Lesson 2: Make It Easy For Your Team To Access Assets
In the past a few years, a lot of different screen sizes and measurement units emerged across iOS, Android, and Web platforms.
We need to consider this and make it as easy as possible for our teammates to access assets in the right format for their platform so that they can start development, so that we don’t have to manually reproduce assets for the right platform, and so that we don’t get caught in back-and-forth email chains last minute while engineering is trying to make a sprint planning deadline.
iOS engineers use pt (points) as their main development unit. This is different from the typographical ‘point unit’ that is available to us in our design tools.
Android engineers use dp (density-independent pixel) as the main unit and sp (scale-independent pixel) for text size.
In Web, there are even more options. Some engineers simply use px (pixels), some use percentage values, and some of them use em/rem values. Both rem and em are relative units, px is not. Relat...
“Using Zeplin has created more time for our team to experiment with designs, as opposed to manually creating design spec documents. Our engineers prefer not having paper or PDF spec documents, instead they can reference designs on-screen.” –Jason Stoff, Sr. Designer at Starbucks
You’ll want to save time preparing specs by automating as much of the speccing, redlining, and asset preparation processes as possible. This is where a design handoff tool comes in.
Before handoff tools existed, designers would print their designs on paper, draw redlines with a pen, and hand the paper to their engineer. The good news is you don’t have to do that anymore. 😅
Now, redlines, specs, and code snippets can be automatically generated using Zeplin by uploading your file from Sketch, Photoshop, Adobe XD CC, and Figma.
Zeplin automatically redlines your file and converts...
In this article, we will dive deeper into one of the most famous examples of Human-Centered Design. Doing so will illustrate the manner in which empathy can drive innovation.
Doug Dietz — an industrial designer at GE Healthcare — had just spent two years designing a new MRI scanner for the company. Having spent a lot of time designing the chamber, controls, displays, patient transfer mechanism, etc. for the new machine, he was really excited to go check it out in person. He skipped through the hospital complex to make his way to the room in which the machine he'd worked so hard on was placed. He struck up a conversation with the technician, asked for her feedback on the latest features, and informed her that the design had been submitted for an International Design Excellence Award — the "Oscars of design". The conversation was cut short by the imminent arrival of a young patient and Dietz was asked to step out of the room.
Z-Pattern, F-Pattern, Visual Hierarchy, and White Space
It is easy to imagine every user excitedly reading every letter you write and every pixel you make. Get over it, because real users don’t do that. They scan. Scanning means they only stop to read when something catches their eye. So today we will learn about scanning patterns:
Let’s start with the most boring design I can imagine: an entire newspaper page of solid text. All one story. No headlines. No images. No breaks or pull quotes. Just text, in even columns, from corner-to-corner.