After 5 years of learning, independent creative agency Siroppe has become a more experienced brand needing a change of image. Our current visual identity is captured on web with flat colors, full color photos, funny content and direct messages.
Our new website is the embodiment of our expertise in digital communication and an expression of our values and personality: a shameless and playful agency that finds cool results working on social media management, graphic design and web development.
An advertising company website usually works as a portfolio and our old project page wasn’t updated, so we decided to shred the projects that didn’t represent our current state and focus on the ones that we really love.
Apart from focusing on our portfolio, our website works as our own platform for blogging too, so we went with Wordpress as our CMS, a very reliable software that we are more than comfortable working with, both as developers and as content creators.
We tried our best to make the site as fast as possible on a vast majority of devices, mostly our home page, the main problem with making this possible was the amount of pictures we used everywhere, if you stop to count there are around fifty pictures on our home page alone.
This can obviously hit load times and data consumption on the user’s side, so we had to implement a lazy-loading solution that would only show the user the images for the sections they visited. Just this implementation reduced our payload size from around 3MB to less than 900 KB.
Most of our website animation works with a plugin called bodymovin.js, this plugin allows us to create awesome SVG animation on Adobe AfterEffects and export them directly to our website in a JSON file.
Most of our website animation works with a plugin called bodymovin.js, this plugin allows us to create awesome SVG animation on Adobe AfterEffects and export them directly to our website in a JSON file.
One of our biggest concerns with this project was making it look as good as possible across all major platforms, so we tested our site on all major browsers (Chrome, Safari, Opera, Firefox) in several platforms (iOS, Android, Windows, MacOS and Linux).
Another important point was making the website look amazing on mobile devices, to do this we had to make some changes to our original designs, for instance, the menu of the site had to change from the closing tabs approach we have on desktop to a more modest slide down animation.
We also had to adapt the last gallery inside our projects, in the desktop version it works based on the user scroll (we used ScrollMagic.js to track user scroll), but we had to go for a swipe activated gallery because it would have made the user navigation really confusing on a touch device.
Our Home page also had to change a bit, we reduced the amount of pictures that scroll by at a given time, so the images could keep their original proportion and not be extremely small.
Siroppe is an independent creative agency based in Valencia, Spain. We form a multidisciplinary team focused on optimizing companies’ communication and brand storytelling, with special attention to online media. We use relevant social media optimization and web development to help businesses grow and meet their goals, supported by very curated graphic design.