Challenge Summary
Welcome to the Rockin RV Customer Survey iPad App Design Challenge!
This challenge involves designing an iPad app that will be used in-store at automobile dealerships, where customer details are currently collected using paper forms - this app needs to replace that system. These forms help the sames team to identify and understand the customer, as well as the potential sales opportunity the customer represents.
The requirements are only 3-4 screens, we are excited to see your designs for this challenge!
Round 1
Submit your initial screen designs for checkpoint feedback:
1. Screen 1 - Step 1 of form
2. Screen 2 - Step 2 of form
We will be presenting the checkpoint submissions to our customer to help show how this process works - make sure your submissions for checkpoint show your solutions clearly!
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Submit your final screen designs for checkpoint feedback:
1. Screen 1 - Step 1 of form
2. Screen 2 - Step 2 of form
3. Screen 3 - Step 3 of form
4. Screen 4 - Thank you screen (optional)
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
This iPad app will be used in-store at automobile dealerships, to allow sales staff to capture user information on the fly (without returning to a desk to grab a clipboard / forms / pencil) and make the process faster. The information is used to assign the customer to member of the sales team and provide the sales person with details about the customer and the customer’s specific interests and reason for visiting. Members are rewarded for their participation, so there is an incentive to complete the form, but we still want to make the form experience clean & simple.
Note: Elderly users are a consideration, so keep in mind best practices for accessibility / ease of reading.
We are going to be showing the customers the submissions at checkpoint, so please ensure your checkpoints illustrate your solution as effectively as possible - we are trying to show them the process.
Keep in mind that this is for use at automobile dealerships, and make a really cool iPad UI! The submissions received in the previous version of this contest did not look like a native iPad app, and didn't entirely adhere to iOS 7 design practices. We'd like to see UI design submissions that really look and feel like they were made for iPad.
You can look at these links for inspiration:
- iPad designs on Dribbble
- iPad Design inspiration
Design Requirements:
- Please design for retina iPad display: 2048 x 1536 px (landscape or portrait orientation as per your preference), at 264 dpi.
- While designing elements, bear in mind that you are designing for retina.
- Do NOT place your design into an iPad frame / template, but design only the content area.
- Portrait OR landscape orientation (open to designer)
- No touch targets (clickable elements) smaller than Apple recommended sizes (88 px at retina size)
- Adhere to iOS 7 design guidelines.
Design Guidelines:
- Use rounded corners for containers and form elements
- Icons should be simple and larger size
- Use placeholder for client logo
- Use of Stock Art is required. The client prefers strong imagery on all screens. Please use imagery related to Camping, RVs (Recreational Vehicles) and prefer imagery that contains: nature / people / families. Images can be large (full background size), and can be distorted (faded or blurred or abstract), but must compliment the client’s color scheme overall.
Screen Requirements:
1. Screen 1 - Step 1 of Form:
- We are not designing the app splash screen, so assume the user has entered the app to find this as his first actionable screen. Imagery here should be strong (large background image?) and the action element large / bold on the page.
- Show the user a step indicator, where they are currently on step 1 of 3 steps.
- Action element: The user must first tell us if they are a member or not and choose how they want to identify themselves. The options we need to show are:
— Yes, I am a member (if this, then these options - only one of these can be selected):
—— scan a membership card (this leads to a camera screen)
—— enter membership number
—— enter email address
—— enter phone number
— No I am not a member (if this then these options):
—— enter email address (show a privacy disclaimer here with a sentence of two of lorem ipsum)
— submit button (label is “Next”)
- Assume for this screen, that the user is a member, has selected “membership number” from the options on this screen, and has entered his membership number into the related text field and will soon hit a “next” button to submit.
2. Screen 2 - Step 2 of Form:
- Show Step 2 of 3 in indicator. User is allowed to navigate back to previous steps.
- User Details: Assume the user was located in the database and show the user info, with option to update, i.e. content on this page will be non editable / static text and option to update or continue or return to home page
— Jack Black
— Member #1234567890
— 1234 Main Street, Minneapolis, MN 55104
— jblack@gmail.com
— (555)123-4567
— secondary action options (options which are less important and should compete visually with primary options on the page) button for “Update My Information"
— Primary page options: “this is not me” and “this is me - Next” button
3. Screen 3 - Step 3 of Form:
- Show Step 3 of 3 in indicator. User is allowed to navigate back to previous steps.
- Visit Details (survey): The user will now complete the client’s survey and provide information about his visit. Form elements on this page are:
— What is the reason for visit? (drop select - selected option is “Research / Purchase RV”)
—— Type of Vehicle (drop select - selected option is “Motorhome”)
—— Year (drop select - selected option is “2014”)
—— Make (drop select - selected option is “Acme RV make”)
—— Model (drop select - selected option is “Acme RV model”)
—— Ideal Payment (drop select - selected option is “$200-250 per month”)
— What brought you to our location? (drop select - selected option is “Advertisement”)
— How would you prefer to be contacted? (drop select - selected option is “Email”)
— submit button (label is “Finish)
4. Optional Screen #4 - Thank You Screen:
- This will be the page the user sees when he completes the survey form. The idea here is to thank the user for participating and also make some recommendations based on his reason for visiting. Content is:
— “Done!” (icon + header?)
— text, “Thank you for participating in our customer survey. You will receive your acme free gift via email.”
— “Recommended for you” (icon + header?)
— some “tiles” with images of upscale RVs and related details (make, model, year, cost) and a “email details to me” and “text details to me” buttons for each.
Fonts and Colors
Typography:
- Use Helvetica fonts only (you may use Arial if you don't have Helvetica)
- Large, easy to read text
- No bold or italic text (use font color and size to define hierarchy)
Colors:
- White or grey for overal background color
- Blue is the primary client color and should be strong on the site
- Red should be used sparingly - maybe just for primary action button on each screen?
- Text (other than button text) only on white or very light grey backgrounds (easy to read)
- No text should be darker than #333333 or lighter than #999999
- Client colors are:
— Blue: #006699
— Red : #990000
— Grey(s) : #EEEEEE through #333333
— White : #FFFFFF
Target Audience
- Customers entering a dealership, looking to provide details of their interests and be connected with the right member of sales staff
Judging Criteria
- Cleanliness of your graphics and design
- User Experience
Submission & Source Files
Preview Image
Create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Please upload PNG images in a zip file with all requested contest requirements stated above. Number your files (01, 02, 03, etc) this will help review them in order.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop or Illustrator and saved as layered PSD/AI files.
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics, images (sizes or colors) or modify overall colors.
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.