RSS FeedTwitterMastodonBlueskyShare IconHeart IconGithub IconArrow IconClock IconGUI Challenges IconHome IconNote IconBlog IconCSS IconJS IconHTML IconShows IconGit IconSpeaking IconTools IconShuffle IconNext IconPrevious IconCalendar IconCalendar Edit Icon
My google avatar.
devrel@google
notecsshtmljstalks

UI Workshop

Sprinkle scroll driven animations, view transitions, popovers and container queries onto an ecommerce home page with me!

Video · Code

Me pointing at a title saying Practical UI/UX WorkshopScreenshot of the development environment on IDX, with a preview window of the site on the rightA screenshot of the light theme designA screenshot of the dark theme designA screenshot of when a product image lightbox is open

Join the conversation on

51 likes
4 reposts
  • GENKI
  • Vadim Makeev
  • Steve
  • Ryan Townsend
Google UI Workshop ✅ scroll driven animations ✅ view transitions ✅ popovers ✅ container queries nerdy.dev/i-put-a-work...
Adam ArgyleAdam Argyle
try hitting that IDX button in this repo to get your own environment made for you super quick github.com/google/io-co...
Adam ArgyleAdam Argyle
watch and follow along on YouTube www.youtube.com/watch?v=oXSF...
Adam ArgyleAdam Argyle

some screenshots of the UI we'll enhance

Adam ArgyleAdam Argyle

follow along on youtube https://www.youtube.com/watch?v=oXSFwix7eR8

Modern CSS for sites: View transitions, scroll effects, and more!
Adam ArgyleAdam Argyle

follow along by hitting that IDX button in this repo https://github.com/google/io-connect-2024-ui-workshop

GitHub - google/io-connect-2024-ui-workshop
Adam ArgyleAdam Argyle

Crawl the CSS Webring‽