Note: If you have a different UI than in the course, you can change it back by clicking the '?' in the bottom right corner of Figma and select 'Go back to previous UI'. Happy Figma'ing!

Figma UI UX Design Essentials

Distinction Certificate Project

This lesson is exclusive to members

Course contents
SECTION: 10
Tips & Tricks 7:21
SECTION: 14
Working with Illustrator 4:16
SECTION: 19
Saving & History 5:42
SECTION: 24
Teams & Projects 5:19
SECTION: 27
Thumbnail update 4:10

Questions

You need to be a member to view comments.

Join today. Cancel any time.

Sign Up

Student class projects

5 2
Avatar

Miranda Kaufmann

@MirandaKaufmann

For my Distinction Certificate project, I chose the fitness app from the brand Garmin (Disclaimer: I do not for this company and this is just a UX case study). Since I use the app every day myself, I noticed a few things that I wanted to improve. I feel that it lacks personality and a more direct engagement with the user, which would help create a stronger connection to the app. Overall, the app is already very user-friendly and well-organized, so initially, it was challenging to find any drawbacks. Positive: The original Garmin-App features a clean and well-organized structure with excellent use of color accents, particularly the blue theme, which adds a sense of calm and consistency. The choice of icons enhances navigation, while the loading animation provides a smooth and engaging user experience. Negative: The original Garmin-App’s color scheme feels dull and overly dark, giving it a minimalistic but somewhat uninviting look. The Challenge page appears cluttered, and the “Newsfeed” feature feels unnecessary, adding little value. Overall, the app lacks engagement elements that could foster a stronger connection with users. I aim to make the app more visually engaging by refreshing the color scheme and overall visuals. I’d like to improve the structure of the Challenge page and calendar for easier navigation, as well as add more personal touches to enhance user connection. Additionally, I plan to remove the unnecessary Newsfeed feature to streamline the user experience. This project allowed me to dive deeper into the world of fitness apps. One of the more challenging aspects was designing the various charts within the app’s functionality, which turned out to be more complex than I had anticipated. Another challenge was displaying the calendar effectively on such a small screen. I had been wanting to try an Instagram tutorial for a spinner feature, and I was excited to incorporate it here. In summary, I am very pleased with the overall look of the app. However, I feel that the color scheme isn’t yet perfect, and the presentation of some features could be a bit more unique.

4 0
Avatar

Andrey Craciun

@AndreyCraciun

Arc'teryx website redesign - Order taskflow from Product page Before & After Before (Original Flow): • What I Liked: The website’s visual design effectively represented Arc’teryx’s high-quality, premium brand. The use of product imagery and detailed descriptions were well-executed. • What I Disliked: • Inconsistent Typography: The typography used on the product page differed from the cart, which disrupted the visual harmony and overall user experience. • Complex Order Flow: The checkout process had too many steps, requiring unnecessary actions from the user before completing a purchase. Plan for Changes: In my redesign: • Consistent Typography: I unified the typeface across all pages to ensure a consistent and seamless visual experience. • Design System Recreation: I focused on recreating the brand’s design system elements, such as typography, spacing, and coluor schemes, specifically for the order task flow. While I didn’t rebuild the entire design system, I used the key elements needed to maintain brand integrity and ensure a consistent user experience throughout the purchasing process. • Simplified User Flow: I reduced the number of steps in the checkout process to improve the overall flow and speed up the user’s journey from product selection to order confirmation. After (My Redesign Flow): • Typography & Design System: The redesigned flow features a consistent typeface and adheres to Arc’teryx’s visual identity, using only the elements essential for this specific flow. This maintains the brand’s premium feel while optimizing the user experience. • Streamlined Checkout: I simplified the checkout process, reducing the steps required and making it easier for users to navigate from product selection to order confirmation without unnecessary friction.

Course info

114 lessons / 12 hours 29 quiz questions 22 projects Certificate of achievement

Overview

Hi there - my name is Dan Scott & welcome to Figma Essentials.

Together - you and me - are going to learn everything you need to get started working as a UX Designer using Figma.

You can try Figma for free by clicking here.

We’ll use this UI UX design tool to create beautiful User Interfaces and engaging prototypes. Most importantly... we'll cover the client expectations of you as a new UX designer. 

This course is aimed at people new to design, new to User Experience design. Even if you’re not totally sure what UX really means, don’t worry. We’ll start right at the beginning and work our way through step by step. 

First we’ll describe the brief & how to work with a UX persona.  

Then you’ll learn how to create simple wireframes.  

From there we’ll look at how to implement colours & images properly in your designs.

You’ll learn the do’s & don’ts around choosing fonts for web & mobile apps. 

You’ll learn how to create your own icons, buttons & other UI components. 

You’ll learn some pretty scary terms such as Components, Constraints & Multi Dimensional Variants. They are all really easy to understand once you know how. 

We’ll also make our lives easier by using free UI kits & plugins for Figma which will speed up our workflow dramatically!

We’ll build a simple Style Guide ready for client handoff. 

You’ll understand how to make both simple & advanced micro interactions, page transitions & animations 

Before the end of this course you will have made fully interactive prototypes 

You will take a project all the way through -  collaborating with other team members and exporting the right files ready to hand off to your developer or software engineer. 

We’ll be focusing on the software Figma but I’ll make sure to explain the techniques & terms used in the UX and how real world projects are run. You will develop a great understanding of the industry and will be able to manage your own UX projects.

I will be setting assignments through the course which will help develop your skills and enable you to create something special and unique for your own portfolio. 

Alright - it's time to upgrade yourself & go from Figma Zero to Figma Hero.

Daniel Scott

Daniel Scott

Founder of Bring Your Own Laptop & Chief Instructor

instructor

I discovered the world of design as an art student when I stumbled upon a lab full of green & blue iMac G3’s. My initial curiosity around using the computer to create ‘art’ developed into a full-blown passion, eventually leading me to become a digital designer and founder of Bring Your Own Laptop.

Sharing and teaching are a huge part of who I am. As a certified Adobe instructor, I've had the honor of winning multiple Adobe teaching awards at their annual MAX conference. I see Bring Your Own Laptop as the supportive community I wished for when I was first starting out and intimidated by design. Through teaching, I hope to bring others along for the ride and empower my students to bring their stories, labors of love, and art into the world.
True to my Kiwi roots, I've lived in many places, and currently, I reside in Ireland with my wife and kids.

Downloads & Exercise files

Download Exercise Files

Transcript

No transcription available for this video.

  • Powered by Marvin
  • Terms of use
  • Privacy policy
  • © Bring your Own Laptop Ltd 2024