Challenge Summary
Welcome to the Dinnaco - innovation mobile app design concepts challenge! This is going to be a fast but fun challenge so make sure you are following along and using your time wisely. In this challenge we are looking for your UI and UX ideas for a web-based application to allow our client to gather exciting and innovative ideas from their employees. We want to see your best UI and UX ideas to make the application engaging and easy to use. A simple and intuitive experience will be key to getting employees to use the application again and again.
We are focusing on a responsive web design with mobile experience being the key device / screen size. If you have time we would also like to see tablet versions of the design but please concentrate on a great mobile experience.
We have a well defined set of requirements which are described in the screens section - we aren't looking for ideas around additional features or functionality at this stage. Please concentrate on the fields and functionality listed and designing that in a neat and intuitive way.
Concepts that are hard to navigate or overly clutter the screen are likely to score less well than a clean, simple, and easy to use website design. As always, please ask any questions in the forum. Looking forward to your design concepts!
01: Initial landing / info screen
02: Log-on screen
03: Idea submission screen
Background:
Our client wants to provide employees with a simple web based application to allow the submission of new ideas to the innovation team who will then collate the ideas and work with particular employees to develop their ideas, potentially into fully developed products, tools or services. Ideas could range from a completely new feature for the mobile banking platform right through to suggestions around how to change internal processes to drive efficiency gains. The application will allow the submission of a short summary of the idea based around a number of key questions. The input will be in text form only.
User journey:
This initial version of the application has a simple employee user journey which consists of 4 main screens, described in detail below. The user journey is as follows:
- User receives an email with a link to the application or receives the link via another communication method such as a poster in the office or on the company intranet site
- User lands on the site for the first time and is shown the initial landing / info screen (Screen 01)
- User reads the information provided and proceeds to the next screen (Screen 02)
- User provides their email address and name, accepts the terms the conditions and then proceeds to the next screen (Screen 03)
- User fills out their idea by answering the key questions asked on the idea submission screen and submits their idea. They then proceed to the next screen (Screen 04)
- User is thanked for submitting their idea and can either leave the site by closing the window or choose to submit another idea in which case they return to the idea submission screen (Screen 03)
Other key functionality:
User can add a 'shortcut' to their device home screen which has the same home icon / logo as the application
Required Screens / functionality:
01: Initial landing / info screen:
- This screen will be shown when the user lands on the site for the first time or when they click the 'Home' icon (please provide a sample logo design - can be from stock art)
- This screen will contain key information about the innovation lab, what the application is for and what happens next
- The screen will contain background information around three key topics (text based content only):
1. What is the innovation lab?
2. What is the application for?
3. What happens next?
- The 'Home' icon will be displayed
- There will be a button to allow the user to proceed to the next screen in an intuitive way
- For this screen you can use "Dummy Text" (Lorem ipsum) as content. You may be asked to modify this content on final fixes
02: Log-on screen:
- This screen will ask the user to input their email address and their name so that ideas can be tracked back to a particular employee (note that the application will not have a fully developed registration / login function initially - this is here simply to capture user details initially)
- The user will be required to confirm they have accepted the terms and conditions of the application
- Once the user has completed the fields there will be a button to allow the user to proceed to the next screen in an intuitive way
- Input fields:
- - Email address - this be validated against the company domain so please consider error state - REQUIRED FIELD
- - Name - REQUIRED FIELD
- - Terms and conditions checkbox - REQUIRED FIELD
- If the user attempts to proceed to the next screen without completing all fields they will be unable to do so
- The user will need to be able to view the terms and conditions which are text based - please show how they would do this - potential options could be to take the user to a different screen or use an overlay but please consider mobile experience
- The user can return to screen 01 via the 'Home' icon
03: Idea submission screen:
- This screen allows the user to input their idea and submit that idea to the innovation team
- The application is intended to encourage the user to write and submit their in a quick and concise way so there is currently no 'draft / save for later' type functionality required although it could be added at a later date
- Input fields:
- - Opportunity name - 160 characters max - REQUIRED FIELD
- - What is the opportunity? - 250 characters max - REQUIRED FIELD
- - Who will benefit? - 250 characters max - REQUIRED FIELD
- - What is your elevator pitch - 250 characters max - REQUIRED FIELD
- Each input field will have a help icon to provide the user with a short background / description / good example answer to the question
- All fields are required so please think about and show error states (Important)
- There will be a button to allow the user to submit their idea and proceed to the next screen in an intuitive way
- The user can return to screen 01 via the 'Home' icon This screen confirms to the user that their idea has been submitted and thanks them for doing so
04: Thank you screen:
- This screen also lays out next steps so the user understands what the process is for their idea to be assessed and potentially moved forward
- There will be a button to allow the user to 'Submit another idea' which takes the user back to screen 03
- The user can return to screen 01 via the 'Home' icon
Target Audience:
- The innovation application will be open to a group of employees within our client - initially between 100 and 200 employees only
Branding guidelines
- The branding on this challenge is pretty open. Below we have provided a primary colour palette.
- Remember that we want a clean, easy to navigate and understand site
- Colour and font usage should be clean and modern
Screen Requirements:
- Mobile (portrait orientation) - 640px width (height can extend as needed)
- Tablet (Only if you have time) - 768px X 1024px.
Judging Criteria
- How well does your design align with the objectives and requirements of the challenge
- Cleanliness of your screen design and user flow
- Overall design and user experience relevant to the data
- New ideas and concepts
Submission & Source Files
Preview Image
Create your preview image as one (1) 1024x1024 JPG or PNG file in RGB colour 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 and Name your files appropriately to aid in the review process. This is very important.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD files.
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics, images (sizes or colours) or modify overall colours.
We are focusing on a responsive web design with mobile experience being the key device / screen size. If you have time we would also like to see tablet versions of the design but please concentrate on a great mobile experience.
We have a well defined set of requirements which are described in the screens section - we aren't looking for ideas around additional features or functionality at this stage. Please concentrate on the fields and functionality listed and designing that in a neat and intuitive way.
Concepts that are hard to navigate or overly clutter the screen are likely to score less well than a clean, simple, and easy to use website design. As always, please ask any questions in the forum. Looking forward to your design concepts!
Round 1
For round 1 we need you to provide the following screens:01: Initial landing / info screen
02: Log-on screen
03: Idea submission screen
Round 2
For round 1 we need you to provide all required screens plus feedback.Background:
Our client wants to provide employees with a simple web based application to allow the submission of new ideas to the innovation team who will then collate the ideas and work with particular employees to develop their ideas, potentially into fully developed products, tools or services. Ideas could range from a completely new feature for the mobile banking platform right through to suggestions around how to change internal processes to drive efficiency gains. The application will allow the submission of a short summary of the idea based around a number of key questions. The input will be in text form only.
User journey:
This initial version of the application has a simple employee user journey which consists of 4 main screens, described in detail below. The user journey is as follows:
- User receives an email with a link to the application or receives the link via another communication method such as a poster in the office or on the company intranet site
- User lands on the site for the first time and is shown the initial landing / info screen (Screen 01)
- User reads the information provided and proceeds to the next screen (Screen 02)
- User provides their email address and name, accepts the terms the conditions and then proceeds to the next screen (Screen 03)
- User fills out their idea by answering the key questions asked on the idea submission screen and submits their idea. They then proceed to the next screen (Screen 04)
- User is thanked for submitting their idea and can either leave the site by closing the window or choose to submit another idea in which case they return to the idea submission screen (Screen 03)
Other key functionality:
User can add a 'shortcut' to their device home screen which has the same home icon / logo as the application
Required Screens / functionality:
01: Initial landing / info screen:
- This screen will be shown when the user lands on the site for the first time or when they click the 'Home' icon (please provide a sample logo design - can be from stock art)
- This screen will contain key information about the innovation lab, what the application is for and what happens next
- The screen will contain background information around three key topics (text based content only):
1. What is the innovation lab?
2. What is the application for?
3. What happens next?
- The 'Home' icon will be displayed
- There will be a button to allow the user to proceed to the next screen in an intuitive way
- For this screen you can use "Dummy Text" (Lorem ipsum) as content. You may be asked to modify this content on final fixes
02: Log-on screen:
- This screen will ask the user to input their email address and their name so that ideas can be tracked back to a particular employee (note that the application will not have a fully developed registration / login function initially - this is here simply to capture user details initially)
- The user will be required to confirm they have accepted the terms and conditions of the application
- Once the user has completed the fields there will be a button to allow the user to proceed to the next screen in an intuitive way
- Input fields:
- - Email address - this be validated against the company domain so please consider error state - REQUIRED FIELD
- - Name - REQUIRED FIELD
- - Terms and conditions checkbox - REQUIRED FIELD
- If the user attempts to proceed to the next screen without completing all fields they will be unable to do so
- The user will need to be able to view the terms and conditions which are text based - please show how they would do this - potential options could be to take the user to a different screen or use an overlay but please consider mobile experience
- The user can return to screen 01 via the 'Home' icon
03: Idea submission screen:
- This screen allows the user to input their idea and submit that idea to the innovation team
- The application is intended to encourage the user to write and submit their in a quick and concise way so there is currently no 'draft / save for later' type functionality required although it could be added at a later date
- Input fields:
- - Opportunity name - 160 characters max - REQUIRED FIELD
- - What is the opportunity? - 250 characters max - REQUIRED FIELD
- - Who will benefit? - 250 characters max - REQUIRED FIELD
- - What is your elevator pitch - 250 characters max - REQUIRED FIELD
- Each input field will have a help icon to provide the user with a short background / description / good example answer to the question
- All fields are required so please think about and show error states (Important)
- There will be a button to allow the user to submit their idea and proceed to the next screen in an intuitive way
- The user can return to screen 01 via the 'Home' icon This screen confirms to the user that their idea has been submitted and thanks them for doing so
04: Thank you screen:
- This screen also lays out next steps so the user understands what the process is for their idea to be assessed and potentially moved forward
- There will be a button to allow the user to 'Submit another idea' which takes the user back to screen 03
- The user can return to screen 01 via the 'Home' icon
Target Audience:
- The innovation application will be open to a group of employees within our client - initially between 100 and 200 employees only
Branding guidelines
- The branding on this challenge is pretty open. Below we have provided a primary colour palette.
- Remember that we want a clean, easy to navigate and understand site
- Colour and font usage should be clean and modern
Screen Requirements:
- Mobile (portrait orientation) - 640px width (height can extend as needed)
- Tablet (Only if you have time) - 768px X 1024px.
Judging Criteria
- How well does your design align with the objectives and requirements of the challenge
- Cleanliness of your screen design and user flow
- Overall design and user experience relevant to the data
- New ideas and concepts
Submission & Source Files
Preview Image
Create your preview image as one (1) 1024x1024 JPG or PNG file in RGB colour 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 and Name your files appropriately to aid in the review process. This is very important.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD files.
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics, images (sizes or colours) or modify overall colours.
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.