Full Stack UI
by @jussivirtanenLearn to build
user interfaces
A compact video course to build components with HTML, CSS and JavaScript.
7+ hours of video content
Plain HTML/CSS/JS
Starter and Complete files
Instant, free access
- +
#1 Intro and setup
6:04In this introduction lesson we get up and running with the tools we're going to use.
View lesson → - +Abc+
#2 Design System
30:51Now we're ready to roll up our sleeves and start to build the foundation we'll use in all the components.
View lesson → #3 Content loading placeholder
1:25:14A sleek placeholder before actual content is available.
View lesson →- Save
#4 Save button
34:14A simple button with a nice loading state and a bouncing animation.
View lesson → - AdultPeople over 18 years old.-0+
#5 Amount chooser
1:04:56Increment and decrement functionality familiar from flight booking services.
View lesson → - Hey there!You have three new messages.CloseHey there!Call awaits.CloseHey there!A new email has arrived.Close
#6 Notifications
59:26Want to notify your users? Here's one way to do it elegantly.
View lesson → - Coming soon
#7 Feedback
1:00:18Spice up your rating experience with these sleek feedback buttons.
View lesson → - Coming soon
#8 Chat
1:33:58A snappy chat component with smooth transitions and interactivity.
View lesson → - 👋🏻
#9 Goodbye
0:40Every journey has an end. Thank you for joining me on this one.
View lesson →
About the author
Hi, I'm Jussi Virtanen, a design engineer. I wrote my first lines of HTML when I was ten years old. Since then, I've experimented with different areas of design, such as drawing, 3D modeling, graphic design, photography and building UIs. Through these experiments, I've become a generalist with a holistic approach to design.
Made in the evenings in Espoo, Finland.