Self Starter Program


PRODUCT DESIGNER AND UI/UX ACADEMY

INCLUDING


  • Design Fundamentals courses
  • Research & Discovery courses
  • User Experience Design courses
  • User Interface Design courses
  • Interactive Prototyping courses
  • Downloadables & Resources
  • Exercise Files
  • Life-time access to all content and future updates

Mentor Intro Call

Congratulations on your purchase of the Self-Starter Program! We’re excited about your career moving forward. Book your free intro call with Vasile.  The 30-min online-meeting is designed to guide you through the program, evaluate your progress and help answer any questions you have.

In preparation for the call, be ready to share a little about your background and your goals for the course. We are excited about your career and look forward to connecting soon!

Study Plan



Week 1
Design Fundamentals 001

Week 2
Design Fundamentals 002

Week 3
Design Fundamentals 003



Week 7
User Experience Design 002

Week 8
User Interface Design 001

Week 9
User Interface Design 002


MODULE 001

Progress
20%

Design Fundamentals

The Design Fundamentals course is the foundation of the App Design academy, providing the building blocks that any designer needs to get started in the field. In this course, Vasile will share trade secrets that he has learned and practiced for more than a decade.

This module will cover the basics of design for those who do not have a background in the field.
We’ll cover the importance of typography, its significance to the reader, and how it plays a role in design. You’ll see examples of what works and what doesn’t.

We’ll discuss color and how crucial it is in the field of design. We’ll examine how colors create impact, how different colors can shape the viewer’s overall experience, and how to choose and work with color. Throughout the course, we’ll examine intricate ways of looking at layouts and how to create interest, break down your content, and evoke an emotional response.

Note: This module will get you ready for the next modules. If you have no experience as a UI designer or UX designer, it is highly recommended that you take this course.

Intro Notes

Typography

Total Duration: 38m 25s

Assignment:
Your assignment is to take the block of text provided here and come up with 10 different layouts.

All layouts should be black and white & you may use any software you choose.

Do not use any imagery. Only use typography.

Tip: Use no more than 3 different fonts and 3 font-sizes for your copy.

Reading Assignment:

Color

Total Duration: 19m 63s

Exercise 001: Design 4-Posters

  • 1st utilizing black, white and 1 color
  • 2nd utilizing primary colors
  • 3rd utilizing secondary colors
  • 4th utilizing tertiary colors
  • Here’s the copy and image

Exercise 002: Apply color to the UI provided

  • Download the APP UI here
  • Select your sources for Inspiration
  • Pick 2-3 colors for each look
  • Render 3 looks
  • Share results with me here
Color Resources:

 Inspiration Resources:

Tip: Use the typography skills learned in the previous lesson

Reading Assignment:
Principles of color in app design

Layout

Total Duration: 33m 63s

Exercise 001:

  • Using the following assets, put together a bi-fold brochure for SculpSure
  • Size: 5.5 x 8.5 (folded)
  • Here’s the Sketch file from the second Layout Video

Exercise 002:

  • Use the first letter from your first and last name to create a monogram.
  • Pay close attention to the negative and positive space around the letters.

Tip: Use the typography and color skills learned in the previous lesson

Reading Assignment:
5 Key Elements of Digital Design Layout

MODULE 002

Progress
40%

Research

Research is a crucial part of any app design project, and all UI designers and UX designers, regardless of experience level, should be sure to take this module.

Before starting on any project, you will want to know what you’re up against, and so it is essential to conduct a surface level assessment of the competition. In this module, we’ll discuss how to do that. We’ll explain how best to determine who the top competitors are, get an understanding of why they are successful, and figure out how to ascertain our competitive edge. What can we bring to the table as a differentiator? What do we have to offer that will set our product apart from theirs?

By the end of this module, you’ll learn:

  • How to identify both direct and indirect competitors — and to understand the difference between the two
  • How to formulate a messaging statement and a positioning statement
  • How to determine the key elements that will drive your product and set it apart from the competition

Research Notes

Identify direct and indirect competitors

Total Duration: 4m 27s

Notes:

  • Select 3-4 direct/indirect competitors
  • Download competitors app, take screenshots and notes
  • If working with a client, determine their needs and compare them with your research

Reading Assignment:
The importance of conducting research in design

Surface level assessment

Total Duration: 2m 42s

Notes:

  • Determine what can you do different from competition
  • What will your app have that the competition does not

Suggested direction & positioning

Total Duration: 5m 01s

Notes:

  • Pick 2 to 3 laterals for the overall direction of the app
  • Build your features around the chosen laterals
  • Keep your app simple. The more complicated your app is and the more feature it has, the lower the probability of your app succeeding.

Examples

Total Duration: 5m 11s

Notes:

  • Follow the examples provided closely in the process of conducting your own research
  • It’s a good idea to come up with a templated outline that you can follow as you work on additional projects

Outro

Total Duration: 1m 01s

Notes:

  • Understand and learn the process well as you’ll use it for the rest of your career
  • Let’s roll up our sleeves and dive into UX next

MODULE 003

Progress
60%

User experience design (UX)

User Experience (UX) design is the heart of any great app or website. It is the foundation you will build your projects upon and the blueprint from which you’ll design your apps or websites. In this module, we will look at how to make apps user friendly, easy to understand, and pleasant to navigate – and why that is so important. You’ll gain a basic understanding of what wireframes, how they work, and why they’re necessary, and then learn how to create both low-fidelity and high-fidelity annotated wireframes.

You’ll also learn how to create sitemaps and functionality flows in Omnigraffle, which is a diagramming and digital illustration application used by professional designers.

Note: If you’ve never designed wireframes and user experience scenarios/flows, we highly recommend taking this course. We’ll be using wireframes in future classes, and this course will prepare you for the remaining modules in the series.

UX Notes

Low fidelity wireframes

Total Duration: 16m 22s

Notes:

  • Work on preliminary sitemap.
  • Sketch out 4-6 sketches of the same screen, with each sketch, get more and more accurate. Here’s an example of thumbnail sketches.
  • Once you have an accurate sketch, sketch 2-3 additional and different layouts for that screen 

Reading Assignment:
Why does UX matter?

High fidelity wireframes & Omnigraffle

Total Duration: 22m 56s

Notes:

  • Render your selected screens from low fidelity wireframes into high fidelity wireframes
  • Use Omnigraffle, Sketch or Adobe XD to render the high fidelity wireframes

References

Reading Assignment:
UX is not UI. What is the difference?

Omnigraffle 7 Pro Essential Training

Total Duration: 55m 28s

Notes:

  • Purchase or Sign Up for an Omnigraffle Trial here
  • Follow the same steps, as provided in the video

Additional Omnigraffle courses

4 Principles of UX Design

Total Duration: 4m 44s

The 4 principles of UX Design are:

  1. Design for your users, not for yourself
  2. Oversimplify functionality
  3. Focus on digestibility
  4. Focus on clarity

Reading Assignment:
How do you create a success ready app?

UX homework assignment

Total Duration: 2m 16s

Homework:

  • Work on a music app that is a direct competitor to Apple Music
  • Design the following screens:
    • Splash
    • Sign Up & Sign In
    • Main Landing page
  • Go through:
    • Research
    • Low fidelity wireframes
    • High fidelity wireframes

MODULE 004

Progress
80%

User interface design (UI)

User Interface design is all about creating a strong visual impact that helps define a brand. You’ll learn the complete process that results in a great-looking app. In this module, we’ll take the wireframes created in the User Experience design module and show you how to build a branded design around them.

You’ll learn how to design apps in Sketch, and also how to use Adobe Photoshop as a complementary software. We’ll cover what mood boards are and why they are important, and discuss how to select colors and typography.

UI intro

Creating mood boards

Total Duration: 8m 59s

Exercise:

  • You may use InVision or any other software of your choosing
  • Pick 2-4 colors swatches and show examples of apps using these swatches
  • Do the same for 2-3 different styles 

Reading Assignment:
Vital Tips on Effective Mobile App Design

Designing the UI in Sketch

Total Duration: 45m 32s

Exercise:

  • Using the wireframe(s) and mood-board(s) designed in the previous courses, work on designing the UI as instructed in the video
  • Mirror your design on to a phone so you can adjust dimensions, color and layout accordingly
  • Design 2-3 different combinations based on the mood-boards you chose and select the UI that looks the best as the final work

Take these Sketch Courses

Reading Assignment:
How to Make an App Addictive

5 Principles of UI Design

Total Duration: 11m 18s

  1. Keep your main colors to 2 – 3

    • You may have additional shades of colors but keeping your colors to a minimum will help you build a more beautiful, and cleared brand
  2. Be sensitive with drop shadows

    • When using drop-shadows, keep them light and clean
    • The darker your shadows, the more it will make your design look less crisp and out of date
  3. Watch your margins

    • Make sure you leave plenty of space on the edges of your design and wherever you have type and iconography
  4. Do not re-invent the wheel

    • While it is ok to be different, you don’t want to design something that is so far off-the spectrum that makes people raise an eyebrow
    • As you build your mood-boards, take hint on overall design-style
  5. Do not copy

    • There is a fine line between inspiration and plagiarism
    • When you build your mood-boards, it is ok to use a similar color palette, it is not however ok to copy an entire layout including icons, typography and imagery

UI homework assignment

Total Duration: 9m 25s

Homework:

  • Work on a music app that is a direct competitor to Apple Music, Spotify and Tidal
  • Conduct the research, and design the low fidelity wireframes and high fidelity wireframes for the following screens:
    • Splash
    • Sign Up & Sign In
    • Main Landing page
  • Work on mood boards:
    • Select 2-3 different color palettes
    • Collect samples of app UI designs
    • Select your typography
  • Design the UI:
    • Use Sketch, Adobe XD or Adobe Illustrator
    • Have two different color options for each screen

MODULE 005

Progress
90%

Interactive Prototyping

Interactive prototyping helps us build a working model of our still designs, and along with wire-framing, it is one of the most important steps in the design process. Interactive prototyping lets you show your design to the client or other stakeholders important to the project, and so it is critical to learn how to do it right.

By the end of this module, you’ll understand how to bring your designs to life and to make them interactive. You’ll be able to create a working model of your app, install it on your phone and then be able to share it with others. You’ll get hands-on with the programs needed to learn how to do this: Sketch, Craft Manager and InVision.

Prototyping intro

Creating a prototype using InVision

Total Duration: 16m 30s

Notes:

  • You may use InVision and Craft to build your prototype
  • After you build the prototype, download InVision on your mobile phone to test your prototype
  • Share your prototype with others and receive feedback

Principles of prototyping

Total Duration: 4m 02s

5 Principles of App Prototyping:

  1. Keep animations to a minimum
    • The more animations you have, the more complex your project will become
    • Talk about Paper by Facebook
  2. Break down your prototype
    • For complex prototypes, break them down into multiple flows
  3. Annotate your prototypes
    • Leave developer or user comments through screens on your prototype
  4. Share your prototypes
    • Use your prototypes in your portfolio pages
    • Share them to receive feedback
  5. Take Joy and have fun
    • Don’t forget to enjoy building your prototypes and have fun while you do it

Homework and last thoughts

Total Duration: 2m 41s

Exercise:

  • Build out the prototype for the music app you’ve been working on
  • For an additional project, work on a productivity app
  • Work on 10-12 portfolio pieces to get you ready to apply for jobs

Mentor Review Call

Congratulations on completing Module 5! We’re excited about your career moving forward. To help guide you in the right direction from here, book a call with Vasile. The 30-min free online-meeting is designed to evaluate your progress, provide guidance and help answer any questions you have.

In preparation for the call, have your assignments ready to share along with questions or concerns. We are excited about your career and look forward to connecting soon!