Challenge Summary
Welcome to the THOLOS Storyboard Challenge!
In this challenge we need you to design a mobile application by using the provided wireframe as guidance. We are looking for an intuitive and easy to use app. The most important thing is how you design a great user experience app.
We’re looking forward to your submissions!
Round 1
Submit your initial designs for Checkpoint feedback:
A- Survey Manager:
1- Login Screen.
2- Landing Page.
3- Create New Survey.
B- Participants:
1- Login Screen.
2- Profile Questions.
3- Landing Page.
4- Prototype Questions.
- Provide us with a click map for your design
- Readme.jpg : Provide notes about your submission
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Your Final design for all the required pages with all checkpoint feedback implemented:
A- Survey Manager:
1- Login Screen.
2- Landing Page.
3- Create New Survey.
4- Survey Details.
B- Participants:
1- Login Screen.
2- Profile Questions.
3- Landing Page.
4- Prototype Questions.
5- Post Testing Questions.
6- Thanks.
- Provide us with a click map for your design
- Readme.jpg : Provide notes about your submission
- Make sure all pages have correct flow! Use correct file numbering (00, 01, 02, 03)
Challenge Description:
THOLOS is a global consumer products company. This application will be used to help their employees efficiently create surveys that their consumers will then use while testing products for THOLOS.
The Purpose of this challenge is the production of the provided wireframe screens for the Survey Manager’s desktop experience and the Participant’s mobile smartphone experience. We are looking for the Topcoder Design Community to help us with planning our new "user experience" (UX).
NOTE that there are two (2) sets of unique screens, one set being used by the Survey Manager on their desktop and the other set being used by the Participants on their smartphone.
Supporting Documents:
- Wireframes: http://ned4bd.axshare.com/#p=login_page
Design Considerations:
We would like you to consider the following while creating your design.
GENERAL:
Even though consumers will be using the application, think of it as a work application where both sets of users will login and perform specific tasks, so keep the feel clean and professional. Some key concepts:
- No banners or other distractions.
- Strong / clear data table and survey form concepts.
- Common / easily recognized icon concepts, where applicable.
- Minimalistic design elements.
- Crisp / clean text.
WIREFRAMES:
- We provided the wireframe screens as guidance on designing this app. The wireframes only show all the required content need to be displayed on the app; we are still open to any suggestion or ideas how to make this app have a great user experience. Please consider this when creating your design.
- Keep things consistent. This means all graphic styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance.
TYPOGRAPHY:
Open to designers but keep in mind:
- This is a web-based application.
- Keep typography simple and clean. Use bold and italic text sparingly please - Instead, use font size or all caps to call out hierarchy. Leave good white space between and around text.
SIZE:
- Design the Survey Manager screens for a desktop at 1280px (W) by 800px (H) at 72dpi.
- Design the Participant mobile screens for a smartphone in portrait view at 320px (W) by 460px (H) at 72dpi.
STYLES and COLORS:
THOLOS does not have defined brand guidelines so Styles and Colors are open to the designer. However, some things to keep in mind are:
-- This is a work application, so design the screens to be clean and professional.
-- Keep things consistent across screens and across both the desktop screens and the mobile screens. This means all graphic styles should work together.
-- All of the graphics should have a similar feel and general aesthetic appearance.
Required Screens:
We following screens to be designed for this challenge (below). Wireframes are provided for each.
NOTE that there are two (2) sets of unique screens, one set being used by the Survey Manager on their desktop and the other set being used by the Participants on their smartphone.
Survey Manager Screens:
SM1: Landing Page.
SM2: Create New Survey - a wizard flow with 3 screens.
SM3: Survey Details.
Participant Screens:
P1: Login.
P2: Profile Questions.
P3: Landing Page.
P4: Test a Prototype (wire is viewable from the Landing Page: click on Test a Prototype).
P5: Prototype Question Screen 1.
P6: Prototype Question Screen 3.
P7: Prototype Question Screen 4.
P8: Prototype Question Screen 5.
P9: Prototype Question Screen 7.
P10: Prototype Question Screen 8.
P11: Thanks.
TARGET AUDIENCE:
This web application will be used by both internal and external users.
The two primary users are: Survey Manager (internal) and Participant (external).
The Survey Manager will be viewing the screens on a desktop computer. The web app will allow him to quickly setup, publish a survey and download the data after the participants complete the survey.
The Participant will be viewing the screens on a smartphone. The web app will allow her to quickly answer questions for the products she’s testing and send the results back to the company
Judging Criteria:
- How well you cover all content included in the wireframes.
- How well you plan the user experience and capture your ideas visually
- Cleanliness of your graphics and design.
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
Please upload jpeg/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 and saved as layered PSD file, or Adobe Illustrator as a layered AI file.
Final Fixes
You may be asked to modify your graphics (sizes or colors) or modify overall colors. We may ask you to update your design or graphics based on checkpoint feedback.
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.