In 2013 I led the team that rolled out a whole new look and feel of The Loop.
This redesign was a mammoth nine-month project – a multi-discipline and multi-location collaboration between leading figures across UX, design and development. The result was a beautifully re-crafted platform ready to take the world by storm.
The Loop Redesign – The Objective
Since launch, The Loop has been an evolving beast, with way more bells and whistles than its original incarnation. As a result, the original style guide got rather lost in the mix and our beloved site was looking and feeling a little tatty around the edges. In fact, an audit of the old design found it used over 83 shades of grey, which definitely wasn’t the original intention. However, the final straw came in August 2012 when we conducted a survey amongst our community. In response to the question, ‘What can we do better?” an overwhelming 89% asked us to improve the design and usability. So their wish was our command!
The overall goal of The Loop’s redesign was to create a wonderful user experience that fuelled platform re-engagement and in turn, increased traffic and new sign-ups.
Our intention was to create a look and feel that every creative professional and business would be proud to be a part of. It was fundamental that The Loop should have a fresh, clean, uncluttered look without being clinical. We wanted to encourage more inspiration and interaction between community members and strike a balance between being friendly and approachable, yet still sleek, professional and highly appealing to senior creatives.
The Loop Redesign – The Team
The project to improve The Loop’s design and usability was a one-of-a-kind collaboration between leading UX Consultant, Matt Morphett (based in an Airstream in Byron Bay); Design Agency, Carter Digital (based in Melbourne)l Senior Freelance Designer, Nick Hallam (usually based in Melbourne, but coerced into bunking down in my spare room in Bondi for the duration of the project); our in-house design extraordinaires, Theo Lampert & Josh Davey (based at The Loop HQ Surry Hills) and our super-talented in-house developers, led by Asanka Dewage (working just outside Colombo, Sri Lanka) & Melbourne based Agency Motherbird who were responsible for applying the new design to all offline collateral. Thank goodness for Skype!
The Loop Redesign – The Process
In order to really address the functionality, as well as the aesthetics, our aim was to go right back to the basics and take the time to find out what The Loop’s users actually wanted out of the platform and work from there by improving what they already loved and stripping back what they weren’t so keen on. This functionality facelift took the form of three phases: Research, Design and Development – with constant testing throughout.
The first stages involved the initial survey, crowd-sourced design feedback from our community and individual in-the-field interviews with 80 community members and clients to get their feedback on what did and didn’t work for their needs.
We synthesised the findings from this research and created a number of archetypal user personas and scenarios. This fascinating information was at the forefront of designing the new wireframes and workflows. After testing the prototypes, we sent them onto Carter Design to apply a new style, fonts and colour palette to key modules of the site. The idea was for The Loop to naturally evolve and mature rather than go through a complete and utter brand overhaul.
For us, look, usability, functionality and quality are all equally important. The Loop is a site for creatives, so the redesign had to look fantastic, serve top-notch content and be useful and intuitive to use. This is why we enlisted the best in the business to take the lead on their respective areas of expertise. The Loop in-house design team and Nick Hallam were responsible for pulling through the design to all the pages on the platform and our development team worked tirelessly to bring all of this to life.
The Loop Redesign – The Outcome
The final product was something we were all very proud of.
The Loop is all about connecting creatives to professional opportunities and it’s now easier than ever to find work, attract clients, follow people and companies who interest you, build a network of industry contacts and use your profile as a powerful self-promotional tool, which allows you to connect with leading figures without knocking on doors and making cold calls.
To Conclude:
Make no bones about it – this redesign was a beast of a project! The Loop is insanely complex. We have a huge community of over 50,000 creatives and more than 100 unique pages to design, not to mention the thousands of user interactions and pathways. Just thinking about the whole scope makes us dizzy. But we managed to pull it off, all thanks to the remarkable collaboration of all the parties above. Dream Team, I SALUTE YOU!
Our absolute favourite part of our website is the community and their work, without which we wouldn’t exist. So we’re over the moon that we finally have a look and feel that does them justice. So the crazy nine months of living and breathing the redesign was worth every second as it gave us the confidence and credibility to take The Loop to London and beyond…
Top Website Design Tools:
About to embark on a web design project? Here are the top tools The Loop recommends using to smooth the process.
Usabilla – www.usabilla.com – Crowdsourcing Feedback from your users
Usabilia is an amazing tool that you can plug into your existing website and allows your visitors to select parts of your website they want to give feedback on.
Prevue – http://prevue.it/ – Internal Feedback Tool
Australian born Prevue is a nifty tool that allows designers to upload and share design interations and get feeback from key stakeholder. No more hovering art directors, you simply feedback and annotate in the cloud.
Plan.io — www.plan.io – Simple Web-Based Project Management
Planio offers a simple integrated web-based project management solution that allows you to feedback, manage, track & priorities functionality & design changes direct to your developers.