
Download the exercise files and the Sigma assets file to access all course assets, then follow along to create a real-world website in Figma.
In Figma, set up a 1920x1080 frame with a 12-column grid, add a logo and navigation, create a hero banner with a call-to-action, and assemble product cards and a footer.
Create the menu screen in Figma by duplicating elements, arranging seven circular item placeholders, adding images and a banner, then include the popular item section to complete the menu.
Create a menu screen in Figma with a product image, rating stars, size selectors, quantity controls, and a red add-to-cart button; include a reviews tab and you might also like.
Create a product details screen in Figma by configuring the cart with three items, adding quantity controls, showing subtotal, shipping, and total cost, and including continue shopping and checkout buttons.
Design a login screen in Figma by shaping input fields, placeholders, and action buttons, including forgot password and social logins with Facebook and Google.
Design a checkout screen in Figma by duplicating frames, creating billing address, order summary, and payment method sections with product details, shipping, totals, terms, and a red place order button.
Figma is one of the most amazing and leading industry design tool used for UI/UX and prototyping for Web and Mobile Apps.
In this course, Instructor Shehzad & Shaher Yar will teach you how to use Figma and how to design a Food Delivery Website along with learning all the new features of Figma by demonstrating a full website design workflow. By downloading the exercise files, you will be able to set up the workspace and start by creating more than 10 Screens of the food delivery website. You will be able to create an impressive user interface by applying artistic skills that will enhance the user experience of the website.
In the last, you'll learn how to prototype your website by creating connections between frames that will bring life to your website, and then you can share your prototype with your friends, developers, clients, and other stakeholders. We will 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.
By the end of this course, you would be able to create efficient web application designs with Figma.