Figma Sites: From Ui Design to No-Code Website
Jeremy Mura, Brand and Web Designer
Regardez ce cours et des milliers d'autres
Regardez ce cours et des milliers d'autres
Leçons de ce cours
-
-
1.
Trailer
1:11
-
2.
Figma Sites Workspace
3:53
-
3.
Design Desktop Version Layout
3:16
-
4.
Design: Text Styles and Navbard Pt.1
4:42
-
5.
Design: Hero and Features Pt.2
6:08
-
6.
Design: Benefits and Footer Pt.3
5:14
-
7.
Add interactions (logo slider, hover effects)
5:20
-
8.
Make Mobile Responsive
4:49
-
9.
Publish Your Website
0:59
-
10.
Class Project and Resources
0:38
-
-
- --
- Niveau débutant
- Niveau intermédiaire
- Niveau avancé
- Tous niveaux
Généré par la communauté
Le niveau est déterminé par l'opinion majoritaire des apprenants qui ont évalué ce cours. La recommandation de l'enseignant est affichée jusqu'à ce qu'au moins 5 réponses d'apprenants soient collectées.
23
apprenants
1
projet
À propos de ce cours
Design and ship professional websites Figma Sites, the brand-new no-code website builder baked right into Figma. Announced at Config 2025, Sites lets you design, prototype and publish—in a single tab.
This crash course is perfect for beginner web designers and creatives who’d rather spend time crafting ideas than wrangling HTML. Whether you’re freelancing, job-hunting, or simply want a slick place to showcase your work, you’ll walk away with a fully-functional, responsive portfolio site—no hand-off, no headaches.
Here’s What You’ll Learn
✨ Launch in One Tool
Design, tweak, and publish directly from Figma’s canvas with one-click hosting and a live preview.
✨ Responsive by Default
Harness Auto Layout and breakpoint presets so your portfolio looks perfect on every screen, from 4K monitors to phones.
✨ AI-Powered Workflow
Peek at the new “Make” AI features that generate production-ready interaction code from plain-language prompts—no dev required.
✨ Publish in Minutes
Connect a custom domain or publish to staging site.
✨ Work Smarter
Use pre built templates inside figma to build your website faster.
By the end of class you’ll have the confidence—and the workflow—to ship beautiful portfolio sites on your own, without waiting on developers.
Rencontrez votre enseignant·e
About Jeremy
Jeremy Mura is an award-winning (LogoLounge Book 12) logo designer, Youtuber and creator from Sydney, Australia.
He has been in the design industry for 10 years working for both small and big brands worldwide. He has worked for brand names such as Disneyland Paris, Adobe Live, Macquarie Business School, American Express and Telstra.
He has over 6M Views on Youtube with over 650 videos uploaded, has taught over 80k Students on Skillshare and has grown a following of 100k on Instagram.
Jeremy has been featured on Adobe Live, LogoLounge Book 12, Skillshare, Conference, Creative Market.
You can follow him on Youtube, Instagram or get free resources on Jeremymura.com
Voir le profil completProjet de cours pratique
Class Project Resources
Resources HERE.
1. Design & Publish Your Portfolio Landing Page or a product of your choosing
Objective: Craft and launch a personal portfolio homepage that tells your story and showcases your best work.
Challenge: Combine engaging visuals, clear typography, and intuitive navigation to leave a lasting first impression.
2. Make It Responsive
Objective: Ensure your site shines on desktop, tablet, and mobile using Figma Sites’ built-in breakpoints.
Challenge: Test, iterate, and fine-tune until every interaction feels smooth on every device.
Class Discussion
Post WIP screenshots, prototypes, and final URLs in the project gallery—I’ll jump in with feedback and tips. Got questions? Drop a comment. And don’t forget to check the Resources tab for handy links, inspiration, and keyboard-shortcuts that speed things up.
Notes attribuées au cours
Pourquoi s'inscrire à Skillshare ?
Suivez des cours Skillshare Original primés
Chaque cours comprend de courtes leçons et des travaux pratiques
Votre abonnement soutient les enseignants Skillshare