Design: Steve Atkin
Having worked on the rebranding of this student accommodation company from the start, including creating the new logo and style guide, it was only natural that Steve and I wanted to produce a website that reflected this new design language.
The underlying site was WordPress-based, but it featuring a number of custom elements including:
- SVG carousels and mapping
- CSS-based business model diagram (that reverted to a text list on extremely small screens)
- Responsive design including size-adjusting hero images
- Custom in-page photo galleries - curated as normal in WordPress, but displayed in double lines of thumbnails with scrolling overflow and lightbox image display
- Various inline forms to request different types of research
- A contact page that went past the usual Google map and let people know the best ways to get around London (e.g. listing tube lines in the correct colours)
- Case study page made by combining multiple pages of clients, for easy editing and displaying.
- Persistent semi-transparent navigation
The CSS model explained
This was the most complex CSS-based diagram I'd done at this point, so I was quite proud of it. Instead of everything being completely drawn, it was made with text, a couple of files with all the backgrounds in strips (including highlighted versions), and a bunch of style sheet commands.