Challenge Summary
Welcome to “RDD Chatbot Desktop Web App Design Challenge”. In this challenge we are looking for you to create the initial design concepts for a chatbot screen that will be used on a web app platform from a Research and Development Division.
Chatbot screen and functionalities are the only screens to focus on this challenge.
Let us know if you have any questions!
1) Chatbot user flow
2) Verbiage Setup Screen
- Important: As part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Please ask in the Forum for a MarvelApp prototype link. You will receive 2 MarvelApp prototypes, one for mobile and one for desktop.
- Make sure to include a URL/Link to your design within your "notes.txt", Important!
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03).
1) Chatbot user flow
2) Verbiage Setup Screen
- Important: As part of your final submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Please ask in the Forum for an MarvelApp prototype link. You will receive 2 MarvelApp prototypes, one for mobile and one for desktop.
- Make sure to include a URL/Link to your design within your "notes.txt", Important!
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Things to think about
- This challenge is focused only on creating the workflow of a chatbot screen. We are not asking to design the website/landing page where this chatbot will be used.
- We will be running an UI Prototype challenge after this one. Have in mind that this application will be developed using Bootstrap 4. So consider all their rules and guidelines when designing. Important.
- This web application chatbot must feel clean, modern and easy to use.
Important:
- Keep things consistent. This means all graphic styles should work together.
- Please use their current branding and web colors.
- Please use the branding provided on this drive folder. We have run some challenges before using this branding. So please, do not reinvent colors.
- For logo use a placeholder. Do not invest time designing a logo. Final logo will be replaced later.
- Focus on the user experience.
Required Screens
1) Chatbot User Flow (Web Desktop Only)
- This chatbot will help increase awareness & education surrounding the new RDD service as well as provide information on crowdsourcing in general to company employees.
- You will need to review and research about how a chatbot should work.
- Think on what is important for a Chatbot to do:
- AI questions & answers
- Virtual Tour
- Keep user on the loop
- How can we make this chatbot looks unique and not like any other chatbot out there?
The following are resources that can help you understand the scope on this challenge; please use this as reference only. Do not copy anything:
- Chatbots & Conversational UI
- Designing chatbots
- Designing a Chatbot Conversation
- How to build a chatbot interface
2) Verbiage Setup Screen (Web Desktop Only)
- Basically this screen admin user will setup the scope of the bot or the bounderies of the bot and user’s do’s and don’ts with the information Chatbot provides.
- You should divide this screen into 2 sections "Do" and "Don't". A list of words (use sample words for now - can be lorem ipsum) should be added for both sections.
Screen Sizes:
- This will be a web application. So please use this specific screen size:
- Desktop: 1280px width or 2560px width if you work on a retina display, height increased as needed.
Target Audience:
- RDD Team
- Final application users
Judging Criteria:
- How well you plan the interactive experience and capture your ideas and experience visually.
- Overall design, UI and user experience.
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
Submit Desktop PNG/JPG Screens. PSD source files
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as a layered PSD file, Adobe Illustrator as a layered AI file and Sketch.
Final Fixes
As part of the final fixes phase, 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.
Chatbot screen and functionalities are the only screens to focus on this challenge.
Let us know if you have any questions!
Round 1
Submit your initial designs for a checkpoint feedback:1) Chatbot user flow
2) Verbiage Setup Screen
- Important: As part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Please ask in the Forum for a MarvelApp prototype link. You will receive 2 MarvelApp prototypes, one for mobile and one for desktop.
- Make sure to include a URL/Link to your design within your "notes.txt", Important!
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03).
Round 2
Submit your Final designs:1) Chatbot user flow
2) Verbiage Setup Screen
- Important: As part of your final submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Please ask in the Forum for an MarvelApp prototype link. You will receive 2 MarvelApp prototypes, one for mobile and one for desktop.
- Make sure to include a URL/Link to your design within your "notes.txt", Important!
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Things to think about
- This challenge is focused only on creating the workflow of a chatbot screen. We are not asking to design the website/landing page where this chatbot will be used.
- We will be running an UI Prototype challenge after this one. Have in mind that this application will be developed using Bootstrap 4. So consider all their rules and guidelines when designing. Important.
- This web application chatbot must feel clean, modern and easy to use.
Important:
- Keep things consistent. This means all graphic styles should work together.
- Please use their current branding and web colors.
- Please use the branding provided on this drive folder. We have run some challenges before using this branding. So please, do not reinvent colors.
- For logo use a placeholder. Do not invest time designing a logo. Final logo will be replaced later.
- Focus on the user experience.
Required Screens
1) Chatbot User Flow (Web Desktop Only)
- This chatbot will help increase awareness & education surrounding the new RDD service as well as provide information on crowdsourcing in general to company employees.
- You will need to review and research about how a chatbot should work.
- Think on what is important for a Chatbot to do:
- AI questions & answers
- Virtual Tour
- Keep user on the loop
- How can we make this chatbot looks unique and not like any other chatbot out there?
The following are resources that can help you understand the scope on this challenge; please use this as reference only. Do not copy anything:
- Chatbots & Conversational UI
- Designing chatbots
- Designing a Chatbot Conversation
- How to build a chatbot interface
2) Verbiage Setup Screen (Web Desktop Only)
- Basically this screen admin user will setup the scope of the bot or the bounderies of the bot and user’s do’s and don’ts with the information Chatbot provides.
- You should divide this screen into 2 sections "Do" and "Don't". A list of words (use sample words for now - can be lorem ipsum) should be added for both sections.
Screen Sizes:
- This will be a web application. So please use this specific screen size:
- Desktop: 1280px width or 2560px width if you work on a retina display, height increased as needed.
Target Audience:
- RDD Team
- Final application users
Judging Criteria:
- How well you plan the interactive experience and capture your ideas and experience visually.
- Overall design, UI and user experience.
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
Submit Desktop PNG/JPG Screens. PSD source files
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as a layered PSD file, Adobe Illustrator as a layered AI file and Sketch.
Final Fixes
As part of the final fixes phase, 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.