MSDN UK Team blog

Get all the latest Microsoft developer news, tools, downloads, tutorials and tips right here, every day.
Search Form
Unfiltered HTML
Developers code with microsoft

Great British Chefs - an app with the user at its core

Unfiltered HTML
Unfiltered HTML

Great British Chefs - an app with the user at its core

  • Comments 1

Dan Ulzhoefer Director of ServiceUI Centric are the brains behind the amazing new Great British Chefs app (GBC), which is pretty much the most beautiful app on Windows 8. Check out the video at the end of the article to see it in action. Despite having hugely successful GBC apps in the iOS and Android Stores, UI Centric were charged with creating no less than the best app in the Windows 8 Store. UI Centric’s Director of Service Dan Ulzhoefer explains how they sweated over the UX and design process to bring the idea to life.

“We were really excited by the opportunity of taking the GBC digital experience to a whole new level on Windows 8.. When I met with the CEO of GBC, Oliver Lloyd, we discussed very early on during the pitch process our desire to create a standout application that really showcased the incredible content. We had a mutual passion and commitment to create a truly spectacular experience, which along with our strong credentials in developing for the Windows ecosystem meant we were lucky enough to be selected as their design and development partner. Our goal from the very outset was to create the best application in the Windows Store, with a UX that surpassed that of other platforms (and they’re pretty good as well, to be totally impartial!).

 Screen shot 1

We identified two primary use cases for the app. Firstly, to entertain, delight and inform users through the beautiful high res food imagery, chef bios, articles and video content. Secondly, to aid in cooking recipes using the advanced recipe search function, recipe details and step-by-step cooking mode interface, timer function and shopping list with isle and ingredients views (you do need to buy the ingredients before you can start cooking, after all).

 Screen shot 4

Our Information Architects (IA) led the UX process. Starting with defined user requirements and our knowledge of the platform we started to wireframe, in detail, the UX. Wireframes are the blueprint of the UX that detail navigation, taxonomy and hierarchy of content, features and functionality.

 image  image  image

Our UX ideation process was very involved – we conducted multiple workshops with GBC before inking any designs. It was important to first understand the experience we intended to create to meet the needs of our users. We went through numerous iterations of the UX before moving on to the design to make sure we didn’t just build a beautiful application. We wanted to go much deeper and build an intelligent UX that leveraged many of the native capabilities of the Windows 8 platform. Multiple iterations of wireframes were worked and reworked until we were satisfied with the application we intended to build. The final application experience was designed to capture the user’s attention straight from the initial loading of the hub pages’ elegant transitions (created in Expression Blend), stunning imagery and an immersive and playful recipe search randomizer. The information architecture was devised to ensure that navigation between content is fluid, feeling like an evolving exploration rather than diving deeper and deeper into a hierarchical structure with potential dead ends. Sweating over the UX doesn’t ad overhead, instead it means saving time and money further down the build process and results in a much happier customer!

Screen shot 3

Windows 8 was the ideal platform to fulfil the two primary use cases because of its native capabilities, such as semantic zoom, snap views, notifications, live and secondary tiles, search and share. Each of these Windows 8 features has been instrumental in taking the GBC app to a new level of refinement. Separating the graphic design stage from the UX process removes biased decision-making influencing the planning of the experience. Once the UX is largely agreed the graphic designs can kick off in earnest. We invest an equal amount of effort in design, working collaboratively with GBC to ensure compliance with brand guidelines, whilst creating a visually arresting interface design. We really were able to create something special. The “content first” philosophy of the Windows 8 platform is a fantastic fit for the Great British Chefs’ brand. The platform highlights their fantastic imagery and recipe content.

Screen shot 2

Once the design was approved we started the build using C# and XAML in Visual Studio, which gave us a lot of flexibility. From our perspective, developing for Windows 8 is really productive due to its coding flexibility and the development tools made available using Visual Studio and Expression Blend. This lets us continually push the design and animation envelope, but still deliver within deadlines and to budget. Performance was key, every transition, animation and interaction had to be elegant. We wrote an entirely bespoke navigation stack that let us completely manage page loading, caching and transitions. We could selectively preload sections of forthcoming pages, cache already created visuals and pages for re-use and selectively overlap pages to allow for smoother page transitions. This led to a much faster and improved experience. The entire team works in an open plan office and regular interaction is encouraged. All team members have full visibility of iterative work throughout the project to make sure that the UX envisaged at the start of the project is manifested in development. Building the GBC app was unique in that we took a joint development approach with GBC to transfer knowledge to the GBC development team so they could continue to maintain the application. To support this Windows 8 development onboarding we hosted GBC regularly at our offices and collaboratively developed the application, offering guidance and advice throughout the process. They were and remain to be an absolutely pleasure to work with. We have an excellent rapport, built on a common ambition to create something special that we’re all proud of. We used Windows Azure to host all the videos and articles because it allowed GBC to host their extensive catalogue of videos in a cost-effective way that can scale with their business. The streaming quality and speed is fantastic!

Screen shot 5

We’ve got lots going on at the moment – we just launched Time Out for Windows Phone 8 and Windows 8 across 6 regions and we’re about to launch a sophisticated Line of Business application that leverages a Windows 8 UI and Windows Azure backend. On top of that we’ve got two Xbox media applications due to launch in July 2013 and several other Windows 8 and Windows Phone 8 applications in production. Our customers are getting phenomenal results from the platform and we encourage them to take a closer look (or get in touch!)

Company Bio UI Centric are market leading multi-platform User Experience (UX) Solutions Company. We provide services to clients in the United Kingdom, Continental Europe and North America. Our services include Information Architecture (IA), Design, Development/QA and Project Management. Additionally we have an in-house state-of-the-art user-testing lab, enabling early testing of UX and design concepts. We’re a Microsoft development partner and have successfully developed over 55+ Windows 8, Windows Phone and Xbox applications. We are expert in creating digital experiences that blend stunning design and best-in-class UX principles to ensure our client's digital properties work hard to deliver results. We are passionate about making things easier for users, ensuring that they can engage with their favourite brands in the most delightful manner, whenever and however within the contexts of their lives. You can find out more at www.uicentric.com.

  • great app

Page 1 of 1 (1 items)
Leave a Comment
  • Please add 8 and 4 and type the answer here:
  • Post