Facebook Parting Thoughts
Enroll in Course to Unlock
Welcome! |
Get Sketch |
Why Sketch? |
Why Design? |
A Brief History of Graphic Design |
Toolbar |
The Left Bar: Layers and Tags |
Group Elements |
Merging Shapes: Union, Subtract, Intersect, Difference |
Symbols |
Mockup Introduction |
Creating a Symbol |
From Text to Outline |
Text Styles |
Shared Shape Styles |
Resizing Pixel by Pixel |
Reshaping/Resizing Using the Space Bar |
Balancing Elements' Visual Weights |
Mail Icon: Quick Exercise |
Shape and Form |
Pictographs |
What is Gestalt Psychology? |
Importing an Image |
Generate Art Boards |
Adding Shapes |
Groups and Shape Properties |
Adding Text |
Exploring Some Property Tools |
Golden Ratio Grid |
Golden Ratio Exercise |
Color Lesson intro |
Color Lesson Categories |
Color Lesson Hue, Chroma, and Values |
Color Lesson Further Considerations |
Color Exercise |
Weather Icon: Part 1 |
Weather Icon: Part 2 |
Weather Icon: Part 3 |
Photo Icon |
Designing a Color Palette |
A Different Approach to Color Palette Creation: 3x3 Color Palette |
Evernote Logo |
ALTERNATIVE SOLUTION : Evernote Logo with Vectors and Bezier Curves |
3D Shapes without Modeling |
Typography Intro |
Typography Initial Terminology |
Typography Space between characters |
Typography Organizing Text |
Typography In Application Exercise |
Apple Developer Tips |
Our first App |
Brainstorming |
Let's start with the Logo! |
Building a Screen |
Modifying the Main Control Bar |
Wireframing: Friends Screen |
Wireframing: Stats Screen |
Wireframing: Check-In Screen |
Wireframing: Profile Screen |
Get This Plug In! |
Adding Some Realistic Visual Information |
Professional Manners: Keeping Our Elements Organized |
Noke Stats Screen Update |
Noke Check-In Screen Redesign |
Noke Profile Screen Update |
Noke Check-In Notification Screen Update |
Creating a Parameters Icon for the Noke App |
File Crash: Recovering From A Potentially Devastating Experience |
Let's Redesign Our Icons! |
Creating a Consistent Visual Vocabulary |
Lost in Your Document? Center the Canvas! |
Updating the Noke Icon |
Creating a Launch Screen |
Exporting our Art boards |
Exporting Individual Elements |
Slices |
Exporting Slices |
Exporting in Batches of Different Sizes |
Design iOS: Part 1 |
Design iOS: Part 2 |
Looking into iOS App Anatomy |
Logo Design: How to Begin |
When Considering the Typeface |
Making Intelligent Use of White Space / Don't Over-do It / Make It Active |
Logos and Colors |
Complementary Colors |
Flexible Use of Color In Logos |
iPhone 6 / iOS 8 Resource |
Twitter Exercise |
Noke App Assignment |
Noke App Assignment Tips / Things to Consider |
Noke Personal Results |
Noke Results: Icons and Launch Screen |
Noke Results: Add Multiple Friends Page |
Noke Results: Friends Page |
Noke Results: Find Friends Page |
Noke Results: Graphs Tutorial I |
Noke Results: Graphs Tutorial II |
Noke Results: Circular Graphs |
Noke Results: Donut Graphs |
Noke Results: Check-In Page |
Noke Results: Edit Profile Screen |
Noke Results: Maps |
Noke Results: Grey Version |
Settings Icon: Part 1 |
Settings Icon: Part 2 |
Settings Icon: Part 3 |
Settings Icon: Part 4 - Alternative Solution |
Adding Assets from Sketch into Xcode 6 |
Facebook App Introduction |
Facebook App: Document Setup / Observations |
News Feed: Introduction |
News Feed: Creating the Frame for Posts |
News Feed: Like / Comment / Share Buttons |
News Feed: Status / Photo / Check In Buttons |
News Feed: Tab Bar Icons |
News Feed: Replicating Text |
News Feed: Making Our Icons Into Symbols (How to add your own shortcuts!) |
News Feed: Placing Items / Finishing Screen |
News Feed: Second Screen |
Why People Use Facebook |
News Feed: Ideas / Workflow |
News Feed: Editing the Drop Down Menu |
News Feed: Adding Notifications |
News Feed: Left Tray Menu |
News Feed Exercise |
Notifications Explanation |
Notifications Exercise |
Profile Page Explanation |
Profile Exercise |
Requests Exercise |
Facebook Parting Thoughts |
Section Introduction |
User Centered Design |
The Process |
Sketching |
Wireframing |
Mock-up |
Prototyping |
Getting Started |
The Idea : Research Is Key |
Toilet Finder : The App We Will Be Working On |
Make Lists |
Information Architecture |
More Lists before Drawing |
My Sketches |
Wireframing in Sketch : Part 1 |
Wireframing in Sketch : Part 2 |
Wireframing in Sketch : Part 3 |
Wireframing in Sketch : Part 4 |
Wireframing in Sketch : Part 5 |
Wireframing in Sketch : Part 6 |
Wireframing in Sketch : Part 7 |
iPhone Wireframe UI Kit |
Sketch Toolbox |
iPhoneMockup |
Introduction : Starting With Existing Screens |
First Screen: Gmail Inbox |
Gmail Inbox: Getting the Basic Screen |
Gmail Inbox : The Tray |
Gmail Inbox : Discussing The Screens |
Gmail Inbox : Making Some Changes |
Gmail Inbox : Further Revisions |
Next Victim : Photo App |
Photo App : Make A Cool Camera Icon |
Photo App : Using Blur Effects and Laying Out the Screen |
Photo App : Adding Icons and Content |
Exercise : Starting With Existing Screens |
Introduction : Assessing Where We Are! |
Mock-up : Working on Proportions |
Mock-up : Moving Away from the Wireframe |
File Explanation/Notes : Part 1 |
File Explanation/Notes : Part 2 |
File Explanation/Notes : Part 3 |
File Explanation/Notes : Part 4 |
Get Sketch Mirror! |
Making Edits in Sketch Mirror |
First Version of the Mock-up : After Some Revisions |
Designing a Logo |
Preliminary Sketches for the Logo |
Add New Toilet Screen |
Edit Map View Screen |
About the Updated List View (+More with Sketch Mirror!) |
How To : Creating an Icon Using the Grid Tool |
How To : Using the Layout Tool |
How To : Using Shadows for the "Go" Button |
Brand Identity and Coherence :The "Go" Button |
Making Color Decisions : Map / List Toggle |
Thought Process : The "Edit" Button |
More Color Revisions : Creating Consistent Visual Appeal |
Changes to The Edit List View : Don't Disorient the User! |
More Color Revisions : The Star Rating System |
Re-evaluating the "Edit" Button : Consistency is Key! |
Re-evaluating Color Choices : The Stars |
Considering a Gesture Instead of a Button : A Usability Standpoint |
Revisions to the the List View |
Icon Design : Creating Some Simple Map Markers |
More Revisions : Considering Shadows |
An Important Decision : Why I Chose a Portrait-Only View |
Creating a Gesture for the "Go" Function |
Showcasing Gestures for Easy User Comprehension |
Creating a Comment Screen |
We May Need a Quick Notification Screen! / Deciding on a Name for the App! |
File Organization : Pulling it Together |
Conclusion : Look At What We've Accomplished! |
Creating an Icon Alternative : The Map / List Toggles |