On a website, a transition is an “animated change between two pages, states, or views,” according to Awwwards. The same way PowerPoint uses transitions to seamlessly change from one slide to another, sites use transitions to enhance user experience and provide continuity between pages.
There are so many great examples of transitions on the web, so today we’ve picked a few of our favorites to show you. And, hey, if you want something cool like this for your own site, click here. We got you!
1. Colorful Transition
Creddy is a home equity loan company with a phenomenal brand and website. Their colorful, illustrative brand is well-designed and user friendly. Because color plays such a huge role in the brand’s identity, it was only natural their transitions should involve a swipe of color.
This not only makes great use of existing brand elements, it subtly conveys the idea that the brand is fast with a quick visual color swipe across the screen. Because Creddy stands by its fast service and quick loans, this transition packs an extra punch.
2. Split Transition
This personal portfolio website for Xavier Cussó is gorgeous and extremely self-reflective of the creator, down to the tab title that changes to “B*tch, please!” when you leave for another tab.
The site’s home page plays this constant split transition, showcasing the designer’s work in a seamless, visually pleasing transition we could watch all day.
3. Design Transition
It’s only fitting that a website dedicated to a design documentary would have beautifully designed visual effects. Each menu option has a different transition and each one is better than the last. It definitely makes us want to watch Design Canada!
What cool website transitions have you seen recently?
For more inspiration, click here, here, or here.
All websites were inspired by Awwwards.com winners and nominees.
{{cta(‘ace73b58-274f-4416-bb2e-d0eda8416db3′,’justifycenter’)}}
