Self Aware’s website opens with a playful interactive header – the letters in their name arrange themselves randomly, with one always ‘vibrating’… when you click on it, you get a new random arrangement and color scheme.
This is a really cool way to introduce their attention to the fine details that runs through their work and the whole website.
Check out this jazzy menu too – a ‘mobile’ holding their three main links, that animates in beautifully and spins slightly as you mouse your cursor.
After a short intro, we see a curated list of their projects, each with a short description and four images.
This works really well, showing a range of visuals from each project to quickly give the visitor an idea of their style.
I love this ‘recently’ section – no need for a full dedicated blog, but a great place to show their recent happenings from around the internet.
The case study pages lead with a big image, showing a little text below to lure you down the page.
They strike a great balance between concise, easy to digest text descriptions…
… and beautifully-chosen visuals, diversely laid out to keep things interesting throughout the page.
The call to action looks great, with some organic shapes piled up on top of a news ticket style banner.
The Work page is really stylish, acting as a full ‘index’ of their projects – I like the use of the fill vs outlined circles to indicate the services performed, and showing which projects have case studies to read.
This section of the Info page caught my eye: the ‘process’ explanations are flexible and adapt when you toggle between design, development and both.
Self Aware really nailed the details on this site from top to bottom – even the enquiry form fits their playful vibes, feeling like a fill-in-the-gaps wedding invitation.
Sign up to receive an occasional email with all the most recent featured sites, resources and portfolio tips.