Challenge Summary
Welcome to “Juno Chatbot Wireframe Challenge”! The goal of this challenge is to come up with planning the user experience for a chatbot to guide the user about our customer’s services.
We need to see intuitive, elegant and easy to use wireframe concepts that will let us design and build the final web-based user interfaces on the next stage of this project. Think about what are the best UX practices when creating this wireframe.
Background Information
Our customer has many services available online with lots of information and they would like the users who come to their web application to find what they are looking for in a more easy manner, rather than go through many web pages. The idea around this challenge is to design a chatbot and to organize the key content and information for it.
This is the sitemap of the customer’s current site. They would like to explore how can those sections be presented as questions. Like for example “SEO Guidelines” can be interpreted as “What are the SEO Guidelines you use?” as a question for our chatbot.
The chatbot will have the role to deliver the information to the customer in the most efficient way possible. He will guide the user through his search to find the service that aligns the most with their requirements.
The chatbot will provide both chat and voice assistance and totally personal experience for the user. It should be friendly and inviting. The user can use some keywords, based on which the AI chatbot will show him some relevant answers.
We have attached 3 screens (State of Industry, Importance of Design, Marketing Automation) from the customer’s website as content examples. You can use those for reference to create a simple UX story of how the user is searching for content and gets relevant content and then he asks more information and how the chatbot is helping him.
The chatbot can have a name – your call on this, and in general, it will become smarter as it will interact with more users.
Other features to think about:
Size
You should plan your experience for Desktop size
Target Users
The customers who visit the site and want to find out more about our services
Tools
- We are asking to work with Axure: http://www.axure.com/
- You can also work with static images but you must include a fully navigable prototype in HTML.
- If you are designing in the Adobe XD or Sketch then it is mandatory that you create the flow using MarvelApp as we are expecting to see a clickable wireframe in this challenge. Feel free to request a Marvel App on forums or email keyla.blue1@gmail.com for that.
- Note: do not use colors in your wireframes, if you use a design tool! Keep it simple – black and white, as we are focusin on the UX here, not the UI.
- You are also allowed to submit pure HTML wireframes
Judging Criteria
- User Experience of the application
- Completeness and accuracy of your wireframes
- How well your wireframes provide a consistent user flow
Stock Photogarphy
Stock photography and icons are allowed in this challenge as per rules: stock artwork and stock icons.
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
Wireframes should be built in HTML or Axure, Sketc, PS or XD.
Source Files
All original source files of the submitted ideas. If you would like to submit notes please include notes.txt file.
Final Fixes
As part of the final fixes phase, you may be asked to modify content or user click paths
We need to see intuitive, elegant and easy to use wireframe concepts that will let us design and build the final web-based user interfaces on the next stage of this project. Think about what are the best UX practices when creating this wireframe.
Round 1
Submit your initial wireframes for checkpoint review. Feel free to add any screens which are necessary to explain your concept.Round 2
Submit your final wireframes plus checkpoint feedback implemented. Feel free to add any screens which are necessary to explain your concept.Background Information
Our customer has many services available online with lots of information and they would like the users who come to their web application to find what they are looking for in a more easy manner, rather than go through many web pages. The idea around this challenge is to design a chatbot and to organize the key content and information for it.
This is the sitemap of the customer’s current site. They would like to explore how can those sections be presented as questions. Like for example “SEO Guidelines” can be interpreted as “What are the SEO Guidelines you use?” as a question for our chatbot.
The chatbot will have the role to deliver the information to the customer in the most efficient way possible. He will guide the user through his search to find the service that aligns the most with their requirements.
The chatbot will provide both chat and voice assistance and totally personal experience for the user. It should be friendly and inviting. The user can use some keywords, based on which the AI chatbot will show him some relevant answers.
We have attached 3 screens (State of Industry, Importance of Design, Marketing Automation) from the customer’s website as content examples. You can use those for reference to create a simple UX story of how the user is searching for content and gets relevant content and then he asks more information and how the chatbot is helping him.
The chatbot can have a name – your call on this, and in general, it will become smarter as it will interact with more users.
Other features to think about:
- The use of natural language
- Based on customer’s initial question, the chatbot can ask relevant questions, to be able to offer better answers
- How can the chatbot present the suite of services in an inviting way to “sell” to the users?
- In addition to voice response, the chatbot will write the text as well
- What other features can you come up with? Do your own research!
Size
You should plan your experience for Desktop size
Target Users
The customers who visit the site and want to find out more about our services
Tools
- We are asking to work with Axure: http://www.axure.com/
- You can also work with static images but you must include a fully navigable prototype in HTML.
- If you are designing in the Adobe XD or Sketch then it is mandatory that you create the flow using MarvelApp as we are expecting to see a clickable wireframe in this challenge. Feel free to request a Marvel App on forums or email keyla.blue1@gmail.com for that.
- Note: do not use colors in your wireframes, if you use a design tool! Keep it simple – black and white, as we are focusin on the UX here, not the UI.
- You are also allowed to submit pure HTML wireframes
Judging Criteria
- User Experience of the application
- Completeness and accuracy of your wireframes
- How well your wireframes provide a consistent user flow
Stock Photogarphy
Stock photography and icons are allowed in this challenge as per rules: stock artwork and stock icons.
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
Wireframes should be built in HTML or Axure, Sketc, PS or XD.
Source Files
All original source files of the submitted ideas. If you would like to submit notes please include notes.txt file.
Final Fixes
As part of the final fixes phase, you may be asked to modify content or user click paths
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.