http://www.benhaddock.co.uk Ben Haddock Mon, 20 May 2013 04:47:01 +0000 http://www.benhaddock.co.uk en http://www.benhaddock.co.uk/Echo-Arena http://www.benhaddock.co.uk/following/benhaddock.co.uk/Echo-Arena Mon, 20 May 2013 04:47:01 +0000 Ben Haddock 5436933 I led the creative in a pitch to ACC Liverpool and its sub-brand the Echo Arena, designing a concept for a new, responsive site. UX, art direction and design Created: 2013 / For: Code Computerlove <img src="http://payload156.cargocollective.com/1/0/29614/5436933/Home.jpg" width="670" height="1460" width_o="1200" height_o="2616" src_o="http://payload156.cargocollective.com/1/0/29614/5436933/Home_o.jpg" data-mid="30434019" border="0" align="left"/> Desktop and tablet homepage. <img src="http://payload156.cargocollective.com/1/0/29614/5436933/Event-Wall.jpg" width="670" height="337" width_o="1200" height_o="605" src_o="http://payload156.cargocollective.com/1/0/29614/5436933/Event-Wall_o.jpg" data-mid="30434319" border="0" align="left"/> The 'event wall'; a long, swipe-able grid of everything that's happening at the arena. <img src="http://payload156.cargocollective.com/1/0/29614/5436933/Search-1.jpg" width="670" height="101" width_o="1200" height_o="182" src_o="http://payload156.cargocollective.com/1/0/29614/5436933/Search-1_o.jpg" data-mid="30434324" border="0" align="left"/><img src="http://payload156.cargocollective.com/1/0/29614/5436933/Search-2.jpg" width="670" height="101" width_o="1200" height_o="182" src_o="http://payload156.cargocollective.com/1/0/29614/5436933/Search-2_o.jpg" data-mid="30434326" border="0" align="left"/> <img src="http://payload156.cargocollective.com/1/0/29614/5436933/Site-Selector-1.jpg" width="670" height="177" width_o="1200" height_o="318" src_o="http://payload156.cargocollective.com/1/0/29614/5436933/Site-Selector-1_o.jpg" data-mid="30434333" border="0" align="left"/><img src="http://payload156.cargocollective.com/1/0/29614/5436933/Site-Selector-2.jpg" width="670" height="177" width_o="1200" height_o="318" src_o="http://payload156.cargocollective.com/1/0/29614/5436933/Site-Selector-2_o.jpg" data-mid="30434335" border="0" align="left"/><img src="http://payload156.cargocollective.com/1/0/29614/5436933/Site-Selector-3.jpg" width="670" height="177" width_o="1200" height_o="318" src_o="http://payload156.cargocollective.com/1/0/29614/5436933/Site-Selector-3_o.jpg" data-mid="30434337" border="0" align="left"/> <img src="http://payload156.cargocollective.com/1/0/29614/5436933/Mobile.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload156.cargocollective.com/1/0/29614/5436933/Mobile_o.jpg" data-mid="30434697" border="0" align="left"/> Phone homepage. I led the creative in a pitch to ACC Liverpool and its sub-brand the Echo Arena, designing a concept for a new, responsive site. UX, art direction and design... http://www.benhaddock.co.uk/NUS-Extra-Apps http://www.benhaddock.co.uk/following/benhaddock.co.uk/NUS-Extra-Apps Sun, 24 Feb 2013 10:46:22 +0000 Ben Haddock 4575306 I designed a pair of mobile apps for NUS extra that allow students to find exclusive money-saving deals near them. You can grab the iPhone app from the App Store and the Android app from Google Play. UX and design Created: 2012 / For: Code Computerlove <img src="http://payload113.cargocollective.com/1/0/29614/4575306/1-Overview.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575306/1-Overview_o.jpg" data-mid="27077256" border="0" align="left"/> Sketches Following a successful pitch and the creation of a promotional concept video, I started on the iPhone app. This involved lots of sketching and writing to figure out exactly what the app needed to do and the best way for people to use it. <img src="http://payload113.cargocollective.com/1/0/29614/4575306/2-Wireframes.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575306/2-Wireframes_o.jpg" data-mid="27077523" border="0" align="left"/> iPhone Here's a selection of key pages from the app. There's useful functionality still to be implemented, which I'll present when it's ready. <img src="http://payload113.cargocollective.com/1/0/29614/4575306/3-iPhone.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575306/3-iPhone_o.jpg" data-mid="27078116" border="0" align="left"/> <img src="http://payload113.cargocollective.com/1/0/29614/4575306/4-iPhone.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575306/4-iPhone_o.jpg" data-mid="27078381" border="0" align="left"/> Android And here's the app on Android. It features the exact same content but the navigation and interactions were adapted to better suit the platform. <img src="http://payload113.cargocollective.com/1/0/29614/4575306/5-Android.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575306/5-Android_o.jpg" data-mid="27078852" border="0" align="left"/> <img src="http://payload113.cargocollective.com/1/0/29614/4575306/6-Android.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575306/6-Android_o.jpg" data-mid="27078857" border="0" align="left"/> I designed a pair of mobile apps for NUS extra that allow students to find exclusive money-saving deals near them. You can grab the iPhone app from the App Store... http://www.benhaddock.co.uk/Betta-Living http://www.benhaddock.co.uk/following/benhaddock.co.uk/Betta-Living Sat, 08 Dec 2012 08:51:26 +0000 Ben Haddock 4575307 I led the design of a new responsive website for Betta Living, a retailer of luxury fitted kitchens and bedrooms. UX, art direction and design Created: 2012 / For: Code Computerlove <img src="http://payload113.cargocollective.com/1/0/29614/4575307/1-Overview.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575307/1-Overview_o.jpg" data-mid="27076312" border="0" align="left"/> A new direction After successfully winning the pitch my first task was to explore a new visual direction for the brand, taking influence from high-end fashion. The goal was to elevate Betta Living above its competitors and after a few iterations we settled on this: <img src="http://payload113.cargocollective.com/1/0/29614/4575307/2-Visual-Direction.jpg" width="670" height="1566" width_o="1200" height_o="2806" src_o="http://payload113.cargocollective.com/1/0/29614/4575307/2-Visual-Direction_o.jpg" data-mid="26487562" border="0" align="left"/> A clean, crisp and aspirational visual style and language. The new site was to act as a beautiful brochure for the products while evoking the experience of browsing the Betta Living stores. Responsive As a responsive site, essentially all content needed to scale and fit to a handful of different screen sizes and devices. But rather than start with the mobile layouts I went all the way to the other end: all pages were designed for large desktop screens first as the core aim was to create a big, rich immersive site to present the products. <img src="http://payload113.cargocollective.com/1/0/29614/4575307/3-Responsive-Design.jpg" width="670" height="645" width_o="1200" height_o="1156" src_o="http://payload113.cargocollective.com/1/0/29614/4575307/3-Responsive-Design_o.jpg" data-mid="26488045" border="0" align="left"/> All pages were printed and stuck to the project wall, giving visibility to the whole team. It was also a handy checklist: once a design covered its wireframe it was complete! Modular product pages For flexibility and variety, product pages were composed of different 'strips', each either a piece of information about a product or an opportunity to promote related items or offers. <img src="http://payload113.cargocollective.com/1/0/29614/4575307/4-Modular-Product-Pages.jpg" width="670" height="757" width_o="1200" height_o="1357" src_o="http://payload113.cargocollective.com/1/0/29614/4575307/4-Modular-Product-Pages_o.jpg" data-mid="26488570" border="0" align="left"/> Some key pages Finally, here's a selection of pages and components across the site and across devices. Kitchen Appliances <img src="http://payload113.cargocollective.com/1/0/29614/4575307/5-Key-Pages-Appliances.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575307/5-Key-Pages-Appliances_o.jpg" data-mid="27076580" border="0" align="left"/> Inspiration <img src="http://payload113.cargocollective.com/1/0/29614/4575307/6-Key-Pages-Inspiration.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575307/6-Key-Pages-Inspiration_o.jpg" data-mid="27076755" border="0" align="left"/> Site-wide blog promotions <img src="http://payload113.cargocollective.com/1/0/29614/4575307/7-Key-Pages.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575307/7-Key-Pages_o.jpg" data-mid="26489474" border="0" align="left"/> The Betta Living Service <img src="http://payload113.cargocollective.com/1/0/29614/4575307/8-Key-Pages-Service.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575307/8-Key-Pages-Service_o.jpg" data-mid="27076761" border="0" align="left"/> I led the design of a new responsive website for Betta Living, a retailer of luxury fitted kitchens and bedrooms. UX, art direction and design Created: 2012 / For:... http://www.benhaddock.co.uk/TransPennine-Express http://www.benhaddock.co.uk/following/benhaddock.co.uk/TransPennine-Express Sat, 08 Dec 2012 08:48:41 +0000 Ben Haddock 4575294 I've created an assortment of things for this train company in the past few years, including a site redesign and campaign illustrations. I also designed and wrote their online brand guidelines. UX, design, copywriting and illustration Created: 2011-2012 / For: Code Computerlove <img src="http://payload113.cargocollective.com/1/0/29614/4575294/TPE-1.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575294/TPE-1_o.jpg" data-mid="24906768" border="0" align="left"/><img src="http://payload113.cargocollective.com/1/0/29614/4575294/TPE-2.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575294/TPE-2_o.jpg" data-mid="24906773" border="0" align="left"/><img src="http://payload113.cargocollective.com/1/0/29614/4575294/TPE-3.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload113.cargocollective.com/1/0/29614/4575294/TPE-3_o.jpg" data-mid="24906777" border="0" align="left"/> I've created an assortment of things for this train company in the past few years, including a site redesign and campaign illustrations. I also designed and wrote... http://www.benhaddock.co.uk/Sony-Computer-Entertainment http://www.benhaddock.co.uk/following/benhaddock.co.uk/Sony-Computer-Entertainment Fri, 07 Dec 2012 11:31:53 +0000 Ben Haddock 1194157 Early concepts for an abandoned game idea. Players would be cast as actors in a collection of film parodies, as they search for fame and fortune. Concept, art direction and design Created: 2010 / For: Code Computerlove <img src="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-1.jpg" width="670" height="376" width_o="1280" height_o="720" src_o="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-1_o.jpg" data-mid="5760012" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-2.jpg" width="670" height="376" width_o="1280" height_o="720" src_o="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-2_o.jpg" data-mid="5760013" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-3.jpg" width="670" height="376" width_o="1280" height_o="720" src_o="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-3_o.jpg" data-mid="5760014" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-4.jpg" width="670" height="376" width_o="1280" height_o="720" src_o="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-4_o.jpg" data-mid="5760015" border="0" align="left"/><img src="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-5.jpg" width="670" height="376" width_o="1280" height_o="720" src_o="http://payload.cargocollective.com/1/0/29614/1194157/Shoot-for-Stardom-5_o.jpg" data-mid="5760018" border="0" align="left"/> Early concepts for an abandoned game idea. Players would be cast as actors in a collection of film parodies, as they search for fame and fortune. Concept, art... http://www.benhaddock.co.uk/Chester-Zoo http://www.benhaddock.co.uk/following/benhaddock.co.uk/Chester-Zoo Wed, 05 Dec 2012 16:00:58 +0000 Ben Haddock 4559973 I brought Chester Zoo's exciting rebrand to life online with a new website. I then let some prehistoric animals loose on it in celebration of the Dinosaurs Bite Back exhibit. UX and design Created: 2011-2012 / For: Code Computerlove <img src="http://payload112.cargocollective.com/1/0/29614/4559973/Chester-Zoo-1.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559973/Chester-Zoo-1_o.jpg" data-mid="24241826" border="0" align="left"/><img src="http://payload112.cargocollective.com/1/0/29614/4559973/Chester-Zoo-2.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559973/Chester-Zoo-2_o.jpg" data-mid="24241828" border="0" align="left"/><img src="http://payload112.cargocollective.com/1/0/29614/4559973/chesterzoo3.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559973/chesterzoo3_o.jpg" data-mid="27467479" border="0" align="left"/><img src="http://payload112.cargocollective.com/1/0/29614/4559973/Chester-Zoo-4.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559973/Chester-Zoo-4_o.jpg" data-mid="24241839" border="0" align="left"/> I brought Chester Zoo's exciting rebrand to life online with a new website. I then let some prehistoric animals loose on it in celebration of the Dinosaurs Bite... http://www.benhaddock.co.uk/McArthurGlen http://www.benhaddock.co.uk/following/benhaddock.co.uk/McArthurGlen Wed, 05 Dec 2012 15:26:09 +0000 Ben Haddock 4559681 I created this long, slender microsite to complement and help promote a trio of pop-up fashion stores across the country. UX and design Created: 2011 / For: Code Computerlove <img src="http://payload112.cargocollective.com/1/0/29614/4559681/McArthurGlen-1.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559681/McArthurGlen-1_o.jpg" data-mid="24240618" border="0" align="left"/><img src="http://payload112.cargocollective.com/1/0/29614/4559681/McArthurGlen-2.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559681/McArthurGlen-2_o.jpg" data-mid="24240620" border="0" align="left"/><img src="http://payload112.cargocollective.com/1/0/29614/4559681/McArthurGlen-3.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559681/McArthurGlen-3_o.jpg" data-mid="24240626" border="0" align="left"/> The full site <img src="http://payload112.cargocollective.com/1/0/29614/4559681/MAG-Spirit-of-Fashion.jpg" width="670" height="2578" width_o="1064" height_o="4096" src_o="http://payload112.cargocollective.com/1/0/29614/4559681/MAG-Spirit-of-Fashion_o.jpg" data-mid="27051144" border="0" align="left"/> I created this long, slender microsite to complement and help promote a trio of pop-up fashion stores across the country. UX and design Created: 2011 / For: Code... http://www.benhaddock.co.uk/T-G-I-Friday-s http://www.benhaddock.co.uk/following/benhaddock.co.uk/T-G-I-Friday-s Wed, 05 Dec 2012 15:23:13 +0000 Ben Haddock 4559662 This loyalty app and Facebook presence were part of a pitch to the restaurant chain T.G.I. Friday's. Sadly we were unsuccessful but at least I got to eat a lot of ribs as research. Concept and design Created: 2011 / For: Code Computerlove <img src="http://payload112.cargocollective.com/1/0/29614/4559662/TGI-Fridays-1.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559662/TGI-Fridays-1_o.jpg" data-mid="24241643" border="0" align="left"/><img src="http://payload112.cargocollective.com/1/0/29614/4559662/TGI-Fridays-2.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload112.cargocollective.com/1/0/29614/4559662/TGI-Fridays-2_o.jpg" data-mid="24241666" border="0" align="left"/> This loyalty app and Facebook presence were part of a pitch to the restaurant chain T.G.I. Friday's. Sadly we were unsuccessful but at least I got to eat a lot of... http://www.benhaddock.co.uk/Chicago-Town http://www.benhaddock.co.uk/following/benhaddock.co.uk/Chicago-Town Tue, 24 Jul 2012 10:48:24 +0000 Ben Haddock 376512 A couple of campaign ideas pitched to frozen pizza-maker Chicago Town. One, a new online home for the brand, and the other a children's game world sculpted from pizza dough. Concept, art direction and design Created: 2010 / For: Code Computerlove <img src="http://payload.cargocollective.com/1/0/29614/376512/Chicago-Town-1.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload.cargocollective.com/1/0/29614/376512/Chicago-Town-1_o.jpg" data-mid="24239241" border="0" align="left"/> <img src="http://payload.cargocollective.com/1/0/29614/376512/Chicago-Town-2.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload.cargocollective.com/1/0/29614/376512/Chicago-Town-2_o.jpg" data-mid="24239243" border="0" align="left"/> <img src="http://payload.cargocollective.com/1/0/29614/376512/Chicago-Town-3.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload.cargocollective.com/1/0/29614/376512/Chicago-Town-3_o.jpg" data-mid="24239246" border="0" align="left"/> A couple of campaign ideas pitched to frozen pizza-maker Chicago Town. One, a new online home for the brand, and the other a children's game world sculpted from... http://www.benhaddock.co.uk/Stodge-Podge http://www.benhaddock.co.uk/following/benhaddock.co.uk/Stodge-Podge Tue, 24 Jul 2012 10:48:19 +0000 Ben Haddock 1194169 Stodge Podge is an event where creative minds gather to chat, eat and drink copious amounts. Code christened the very first Manchester Podge with an 8-bit gaming theme and I art directed the printed bits and wrote copy across the whole project. Art direction, design and copywriting Created: 2011 / For: Code Computerlove <img src="http://payload.cargocollective.com/1/0/29614/1194169/Stodge-Podge-1.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload.cargocollective.com/1/0/29614/1194169/Stodge-Podge-1_o.jpg" data-mid="24240353" border="0" align="left"/> <img src="http://payload.cargocollective.com/1/0/29614/1194169/Stodge-Podge-2.jpg" width="670" height="446" width_o="1200" height_o="800" src_o="http://payload.cargocollective.com/1/0/29614/1194169/Stodge-Podge-2_o.jpg" data-mid="24240373" border="0" align="left"/> Stodge Podge is an event where creative minds gather to chat, eat and drink copious amounts. Code christened the very first Manchester Podge with an 8-bit gaming...