{{ searchResult.published_at | date:'d MMMM yyyy' }}

Loading ...
Loading ...

Enter a search term such as “mobile analytics” or browse our content using the filters above.

No_results

That’s not only a poor Scrabble score but we also couldn’t find any results matching “”.
Check your spelling or try broadening your search.

Logo_distressed

Sorry about this, there is a problem with our search at the moment.
Please try again later.

Gifts and gadgets e-tailer Firebox recently underwent a major site redesign as it joined the steady trickle of ecommerce players that have adopted responsive design.

Responsive design is generally seen as the best way of delivering a consistent user experience as the size and usability of internet enabled devices becomes ever more diverse, yet it’s notable that smaller retailers have been much quicker to embrace the technology than big name brands.

So to find out more about why Firebox went responsive and the processes involved in making the move, I spoke to creative director Aaron Buckley...

1. Why did you decide to redesign the site? What were the main problems with the old version?

We loved our old site but it had become a little stagnant; it wasn’t current or responsive. We really wanted to show more activity and movement on the homepage. 

With hundreds of products on the site it’s easy to just focus on the new stuff and not highlight what customers are actually talking about and buying. 

The new homepage showcases new products, seasonal features, charting products (our Top 50), customer reviews and a live feed of what customers are buying and voting up.

We've also rebranded so we wanted the site to be a different beast. We want to show how established we are at finding the quirkiest, coolest products you wouldn't normally find or even expect to exist. 

2. What attracted you to responsive design ahead of a separate mobile site?

Websites need to work on multiple devices; we wanted to make sure users have the same great experience whatever they’re browsing on. 

It’s time intensive building two separate sites and also unnecessary – it’s not what our customers want. 

3. I know its early days, but have you noticed any major differences in how people are interacting with the site, and specifically mobile visitors?

We've definitely noticed a sharp increase in mobile traffic. People are now browsing for longer on their mobile devices, and newsletter and social traffic is also converting better than previously from mobile devices. 

The homepage is much more engaging and is constantly changing which is an incentive for people to come back and check it out. 

We’re more focused on our load times and touch points to make sure our customers can easily browse and buy. 

4. How long did it take to build the site, including the initial design phase?

We turned it around pretty fast. We started chatting about it in the middle of January, then wire framed it for a week before our tech team started working on it at the beginning of February. It was then launched on 13th March. 

This is a short amount of time when you take into account day-to-day design and tech work needed to keep the car running, but our passion and enthusiasm saw us through. It was a lot of fun to work on. 

5. How much did the redesign cost and did it come in on budget? Were there any unexpected costs?

The takeaway pizza we bought for late night work sessions ended up costing way more than we thought.

6. Did you work with any agencies? If not, where did you recruit your in-house team from and how many people worked on it?

It was all done in-house. We have a design team of four and three web developers from various backgrounds. 

But I can't say we're even nearly finished yet. If you saw our Basecamp you'd see a never-ending list of improvements we’re working on. 

Customers are giving us feedback every day, each giving us ideas for improvement.

7. Which specific tools did you use find most useful during the design process (e.g. for wire framing, user testing)?

Definitely Basecamp. There's nothing more satisfying then ticking off your list of assigned actions and seeing the progress we were making. 

For the design process we went old school and wire framed with a Sharpie and some graph paper. 

                      

We'd done a lot of analytics work and our own in-house testing to see what was currently working and what we could improve on. We then mocked up our designs and style sheet in Photoshop. 

I always find the most helpful process is to concentrate on the style sheet as much as possible, otherwise when more than one techy is working on the project you tend to see slightly different sized buttons and header styles creeping in. No offence to our techies!

8. Which part of the site proved to be the biggest challenge in the move to responsive design (e.g. product pages, checkout)? 

The product pages were pretty tricky to make responsive but the hardest part has been our checkout. 

We've had to tackle the legacy code and the forms in general have been time consuming as there are so many individual elements that need to work together in every view.

9. Which part of the site are you most proud of? 

I'd have to go for the homepage; it’s a merger - almost collaboration - between us and the customer. 

I love seeing what people are engaging with on the Live Feed, it’s like looking into someone else's trolley in the supermarket.

David Moth

Published 15 May, 2013 by David Moth @ Econsultancy

David Moth is Editor and Head of Social at Econsultancy. You can follow him on Twitter or connect via Google+ and LinkedIn

1679 more posts from this author

Comments (11)

Comment
No-profile-pic
Save or Cancel
Avatar-blank-50x50

Sebastian Franck

Really, impressive work, guys! What's perhaps even more impressive is that you did it in such a short time frame. Love the humor on the site, too.

about 3 years ago

Avatar-blank-50x50

Rob

Love the new Firebox site - even though this article says it's joining the steady trickle of retailers moving to responsive design, I think that Firebox have raised the standard for ecom sites moving forward.

about 3 years ago

Avatar-blank-50x50

Yvonne Chien, Head of Digital at Abcam

Sounds like an excellent and successful project, and as Sebastian mentioned, from brainstorm to completion in two months is phenomenal.

I would be interested to hear what sort of view>buy conversion rate uplift this has generated on the target devices, and suggest that perhaps the reason bigger retailers have not adopted this so quickly is that the conversion and user experience improvement might not represent a significant amount over and above other projects they have prioritised (since we all know how hard it is not only to move the conversion needle, but to make a reliable business case for that when often we have to take a risk on how positively or otherwise it will impact user behaviour). Many big retailers also have full, standalone mobile websites which would become obsolete.

Personally, I like the prospect of our website being made responsive but there is not enough mobile traffic - yet - to make the case for an improved UX or a significant conversion uplift and therefore warrant a full responsive re-work.

Congratulations again on your project, Firebox.

about 3 years ago

Avatar-blank-50x50

Mat Diss

This is another great example of responsive design.

1) Huge page size (2.1MB for the homepage) - works great on a 3G or 2G connection!

2) Toilet roll scrolling pages - how many people bother to get to the bottom of the page?

The site 'works' on different devices, but is not optimised for different devices.

I would urge you to watch this clip from a Google web developer that talks about the performance implications of sending this much data over a wireless network - http://www.youtube.com/watch?v=0UNWi7FA36M&feature=youtu.be

about 3 years ago

Avatar-blank-50x50

Robert Else

I love the redesign. It's certainly moved on a long way from the old site. I love the product reviews and the top 50. The speed you've turned this around, from initial chat to launch, is impressive. I'm tempted by the Tetris Lights now too... I should know better.

One slight issue I found is with the product video controls. When you try and adjust the volume, or pause the video, the lightbox container automatically closes. This glitch was on Firefox (21) on a Windows based machine. It was fine on the short test I ran on IE8 onwards and on Chrome.

Well done on the redesign anyway and thanks for sharing your insights.

about 3 years ago

Avatar-blank-50x50

Ess

"the hardest part has been our checkout. "
Presumably still a work in progress? basket / checkout doesn't seem to be responsive yet.

about 3 years ago

James Gurd

James Gurd, Owner at Digital JugglerSmall Business Multi-user

Afternoon all,

It's interesting to stumble across web design teams that are designing for mobile/touch screen first, then making it responsive to desktop. If you look at the iconography and main menu options, that's clearly mobile first.

And the results would indicate it is paying dividends, at least in terms of the mobile traffic.

I'd love to see conversion stats on desktop vs/ mobile for old vs. new site. David - can you persuade them to share % changes?

cheers
james

about 3 years ago

Avatar-blank-50x50

Rahul

Excellent stuff and very well done. I expect to have the same experience on the upcoming Firefox OS and wish you well. Firefox is the ultimate browser and will continue to dominate with such exciting stuff.

about 3 years ago

Avatar-blank-50x50

Jack Jarvis, Owner at The Website Review Company

It would be interesting to hear an update on sales performance. It was a brave move to opt for a very design led website (open pages similar to Pinterest).

I feel Firebox can just about pull this off as they are a unique company, have a fun appeal and visitors are their to browse for ideas not always specific products.

However, for most eccommerce sites, I think this would be a step too far. For most websites, people are there to look for something specific and a more traditional and structured website would be more effective.

about 3 years ago

David Moth

David Moth, Editor & Head of Social at EconsultancyStaff

@James, I can certainly ask the question. I'll get back to you if I find anything out.

about 3 years ago

Avatar-blank-50x50

ebaystore designer, Owner at eBayStoreDesigner

Nice one. Short and sweet. HELPFUL!!! Thanks you for share with us.

about 2 years ago

Comment
No-profile-pic
Save or Cancel
Daily_pulse_signup_wide

Enjoying this article?

Get more just like this, delivered to your inbox.

Keep up to date with the latest analysis, inspiration and learning from the Econsultancy blog with our free Daily Pulse newsletter. Each weekday, you ll receive a hand-picked digest of the latest and greatest articles, as well as snippets of new market data, best practice guides and trends research.