Challenge Summary
A major insurance company is building a Windows Store app for the Surface tablet. Your task is to make a set of storyboards based on the completed wireframes. We are looking for a design that works well for touch-driven use and that adheres to Microsoft's guidelines for Windows Store app UX. Vector-based graphics are required so that we can scale your storyboards to any screen resolution. The aesthetics of the app should be in line with the current state of the art for Microsoft mobile platforms.
Round 1
Complete a set of vector-based storyboards for all screens in the wireframe document.
Round 2
Enhance your complete set of storyboards in response to milestone feedback.
Style requirements
The attached wireframes specify the layout and user flow of the application, which will allow consumers to manage their portfolio of insurance policies. We are seeking storyboards that render these wireframes with a bold, streamlined look for the app, in keeping with Microsoft's new aesthetic standards for Windows 8, Windows RT, and Windows Phone. Your design should make the app look like it belongs on a Surface tablet. It should inspire the consumer to reach out and start touching and swiping the interface.
Please consult the following design guidelines before you get to work:
- Designing great productivity apps for Windows Store apps
The screenshots in the above document illustrate best practices for designing an app that will run on the Surface tablet. Note that the application not only takes up the full screen, it can have pages that extend horizontally beyond the visible area. The user will swipe horizontally to see additional content. This functionality is implemented in the wireframes -- you can click and drag to simulate the swiping gesture -- and we expect to see it reflected in the storyboards.
App functionality
The user of this app has purchased vehicle insurance and/or home insurance from our client. Users search for an insurance agent when they want to purchase a new policy.
Most of the time, users are managing their existing policies. For home insurance, the details of a policy include the location of a house, its value, and the value of its contents. The interface includes photo upload and management features. For vehicle insurance, details include the type of vehicle (car, truck, motorcycle, mobile home, boat, snowmobile, dirt bike) and its brand, model, year of manufacture, license number, accident history, and photographs from several angles.
A claim is a request for reimbursement under a specific policy for a vehicle or home in the customer's portfolio. A customer may have multiple vehicles and/or homes. The claim includes details of the loss that are relevant to the type of event. For example, the claim for a vehicle accident describes the time, place, vehicles involved, type of accident, and police report number. Vehicles and homes are subject to many kinds of losses: accident, theft, fire, flooding, and so on.
Another portion of the interface deals with items in a customer's house that are covered by a home insurance policy. The collection of items is called an inventory. There is a description and a picture of each item. Pictures can be uploaded from the device or taken on the spot with the built-in camera.
Technical requirements
The following document provides guidelines on the required padding between page elements:
The aspect ratio of the touchscreen is 16:9, with a minimum resolution of 1366 x 768. However, we would like to scale the app design to other resolutions. Therefore, we require that you work in a vector-based image format. Do not insert any photographs or other bitmaps into your submission. Please make a placeholder to represent photographs.
Before uploading your work, please export the storyboard pages to PNG and SVG format for the submission zip file.
Branding
The client's signature colors are #0077bf and #ffffff. The primary logo features blue lettering on a white background, but there are variants with white lettering on a blue background. A logo may be provided with the milestone feedback; please use a placeholder with the word "Talos" for now.
The client's competitors use red (approximately #b3040a) and green (#7abc62 and #4f6c3c) in their branding. These colors should be avoided.
Target audience
You are designing a Windows Store app to be used by the customers of an insurance company. The user is an ordinary American consumer who has purchased vehicle insurance and/or home insurance.
Judging criteria
- Do your storyboards fully implement the wireframes?
- Does your design comply with Microsoft's design guidelines for Windows Store apps?
- Have you designed an exciting interface that encourages consumers to start using this app to manage their insurance portfolio?
What to submit
Submission zip file: Your storyboards in two formats: PNG (768 pixels tall) and SVG.
Source zip file: All original, fully editable source files of the submission.
Preview image: Create a 1024x1024 JPG or PNG screenshot of your submission.
Final fixes
You may be asked to complete one round of minor changes to ensure that your submission meets the stated requirements of this contest. More information about final fixes.
Please read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. It is important that you monitor any updates provided by the client or Studio Admins in the forums. Please post any questions you might have for the client in the forums.