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
here's some screenshots of the UI we'll enhance
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‽