Challenge Summary
Welcome to Kardon Connect Demo App Wireframe Challenge by HARMAN!
The Harman Kardon OMNI HD Wireless Speakers have recently been launched into the global market. The speakers feature proprietary technology that allows for wireless streaming of both HD Audio and Video. Showcasing the features of this technology at the retail point-of-sale has proven challenging for marketing teams. Traditional marketing methods such as utilizing a plug-and-play retail POS provides consumers only a limited insight into the features and benefits of the OMNI line. As such, our products are not clearly differentiated from leading competitors in the marketplace.
The POS app will allow consumers to interact with the OMNI wireless speakers within the retail environment. The app will have a similar look and feel to the HK Connect App, but will be modified to provide a simpler, more straight-forward experience. The consumer should be able to intuitively navigate the app, play music, and adjust which speakers play to get a general sense of how the system would work in their home.
The end-goal of this application centers on increased sell-through. By clearly showcasing the broad benefits to the consumer, the probability for sale (and reduced returns) grows significantly.
Round 1
Submit your wireframe for a Checkpoint feedback:
- Use case 1. (iPhone + iPad)
- Use case 2. (iPhone + iPad)
- Any comments about your wireframe, make sure all pages have correct flow!
Round 2
Final wireframe plus any Checkpoint feedback:
- Use case 1. (iPhone + iPad)
- Use case 2. (iPhone + iPad)
- Improve Current App. (iPhone or iPad)
- Any comments about your wireframe, make sure all pages have correct flow!
Challenge Description:
Allow salespeople or consumers in stores to demonstrate how to control different speakers and play music over them - a simplified experience based off of the current Connect App so the users can just do certain, non-modifiable actions within the app - focus on single click to play demo scenarios. The current App we need simplified is the full application for home users to control their entire home systems.
Wireframe Expectations:
- Produce HTML click through wireframes that can be used to demonstrate all mentioned functionalities as required in each round.
- The website must be very easy to use and intuitive. Keep that in mind when designing your solution.
- You MUST cover all screens mentioned in required new sections below, if any requirement is missing in final submission the client will not take a look at it, so make a checklist for the required screens to make sure you designed all of them.
- Please show us your proposal as a movie or series of wireframes that communicate the user’s intended interaction with your proposed solution.
- You MUST use wireframes note pane in every single page you design to explain what items are addressed in that page from the documentation, what things you added/changed/removed, use it to make your idea clearer and help the client to give you constructive feedback.
Wireframe Considerations:
- The application should be intuitive, easy to use, and with a great user experience.
REMEMBER:
- Provide separated step by step screens to help explains your solution.
- We would appreciate it if you can suggest the page drill down as much as you can.
- The application functionality must be possible to use.
Supporting Documents:
- Current App. (Please download to understand the current flow for the full app)
- Speakers In Store Image (harman speakers in store.png.zip)
Screen Size:
- iPhone 5: 320px x 568px.
- iPad: 1024px x 768px.
Demo App Overview:
Attached an image of a mock display with which the Demo App will be used (harman speakers in store.png.zip). In addition to the image, there will be various other display executions/formats/layouts. For example, speakers may be simply arranged on shelves, with marketing signage as a backdrop. An iPad will be connected to an independent, isolated Wi-Fi network servicing the connected OMNI speakers. The plan is that they will be driven by the OMNI Demo App.
Chief Objectives:
The App makes it easy for consumers to demo OMNI speakers within the retail environment. The commercially available Harman Kardon Controller App is too difficult for consumers to learn on-the-spot, in the store. Hence, we need a simplified Demo App thats makes it possible for consumer to “self-service” – as in, no sales associate needs to support the experience. It shall:
- Make it easy to select and play music tracks; allow for easy selection and transmission to single or grouped speakers.
- Support Party Mode – activates all available speakers for simultaneous play
- Single or grouped play (as mentioned above)
-- See all use cases here: https://youtu.be/OQc6uQTvGDU
-- See how the current app works: https://www.youtube.com/watch?v=avKvNws0yUQ
Required Features:
1- Use Case 1:
- Demo App starts/opens with a menu – at this start menu you can either jump right into interacting with the speakers, or go into a sub menu with video content (from which the accompanying audio will play thru the displayed speakers):
- Videos:
-- What is the OMNI HD Wireless System:
https://youtu.be/5-_ZFDw-rG8
-- Explaining the re-streaming function; i.e. the fact that you connect any media source to rebroadcast over the OMNI speaker network:
See video here: https://www.youtube.com/watch?v=umlnSrfCOZQ
-- Commercials: https://www.youtube.com/watch?v=MdC448TCyiw
-- These videos will ship pre-installed with the App, but there should be the opportunity add/update as well.
- Upon entering the demoing mode, there should be an overlay on the app that is a “mini-tutorial” (similar to what is made available in the HK Controller App upon the first use -- this can be skipped by the user with
a press of a button). This “walk-thru” overlay would show the user how to select music, select the speaker(s) as well as manage volume/playback controls.
- This app needs to be pre-configurable by the Harman retail installation team. For instance, Harman should be able to set-up playlists in the app that cannot be modified later by a common customer at retail. In addition, Harman team needs to be able to modify the speaker arrangements based on the actual, available units deployed in the retail space. Sometimes, we will have two speakers, sometimes three.
- The initial app configuration needs to be simple.
- The Demo App should look like the existing HK Controller App, download it either at Google Play or Apple App Store to understand it more thoroughly.
- Idle mode – while idleing, i.e. nobody is interacting with the speakers, content should be playing:
-- The marketing video and how-to video:
https://www.youtube.com/watch?v=MdC448TCyiw (no volume while idleing, but will play with audio if the consumer decides to play the video)
Music Content:
- The consumer can select from pre-loaded content.
Playback Controls:
- Play, pause, advance track, reverse track, sweep function.
2- Use Case 2:
- The app will recognizing the speakers and configures them to an in-store mode.
- In store mode we should do the following:
-- Speakers should be able to have volume control: all other functionalities should be idle.
-- When people have touched the speaker’s volume and finished trying the app, it needs to go back to a preset volume level. This to prevent that when volume is set to zero and shoppers interact they believe the speaker is not working.
3- Improve Current App:
- You are encouraged to suggest enhancements for the current app, feel free to suggest improvements for the overall app.
Learn Axure:
New to Axure? Here are some quick tutorials to help you get started:
http://www.axure.com/learn
Target Audience:
- Salespeople or consumers in stores.
Judging Criteria:
- User Experience of the application.
- Completeness and accuracy of the wireframe.
- How well your wireframes provide a consistent user flow
- Your wireframe possible to build as Responsive Design application
Submission & Source Files:
Preview Image
Please create your preview image as one (1) 1024x1024px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Generated HTML files with all the requested contest requirements stated above.
Source Files
Wireframes should be built in Axure. The resulting files should have generated HTML files. Also, all the content must be listed and the pages are linked together to show page flow.
Final Fixes
As part of the Final Fix phase, you may be asked to remove, update, or change some features of the wireframe.
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.