Challenge Summary
Welcome to Cloud Dealer - Responsive Website UI Design Concepts Challenge!
In this challenge, we need your design expertise to design the cloud services portal that allows the cloud servicing companies to sell their products and also allows individual/companies to buy these services through this site.
Round 1
Submit your initial screen for Checkpoint feedback
1.0 Cloud Dealer Marketing Info Page
2.0 Cloud Dealer Portal (Dashboard)
3.0 Cloud Dealer Marketplace
4.0 Product Details
6.0 Cloud Dealer Management
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Your Final designs for all the required page with all checkpoint feedback implemented.
1.0 Cloud Dealer Marketing Info Page
2.0 Cloud Dealer Portal (Dashboard)
3.0 Cloud Dealer Marketplace
4.0 Product Details
5.0 Cloud Dealer Shopping Cart
6.0 Cloud Dealer Management
6.2 Cloud Dealer Project Detail
Optional Pages:
If you have time, please do show us these pages
6.1 Cloud Dealer Management “Projects”
6.3 Cloud Dealer Management “Users”
7.0 Pricing Comparison
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
We would like your help in building out our Cloud Dealer Marketing and Portal sites. Cloud Dealer is a one stop shop for our customers to come and browse, build, and manage their cloud based solutions.
There are two parts to this design challenge. Think about how we can market and sell this service to our customers. We need to build a info or marketing landing page. This page will have an overview of Cloud Dealer, explain the benefits of using it and provide links to enroll, browse, or log in to the Cloud Dealer Portal where they can shop for service solutions, provision custom solutions, and manage existing solutions.
What is a Cloud Dealer and what does this site deal with?
A cloud dealer is a third-party individual or business that acts as an intermediary between the purchaser of a cloud computing service and the sellers of that service. In general, a broker is someone who acts as an intermediary between two or more parties during negotiations.
Challenge Downloads:
- Please find the Flow Document, design direction document and inspirational images in Google Drive
Design Requirements:
- Cloud Dealer is a clean modern site that is approachable and friendly in nature. Bright colors, friendly intuitive user experience, and ease of use are all hallmarks of the Cloud Dealer brand.
- Use clean modern typography and white space to help make a complex design problem seem simple.
- As this site will be responsive, consider responsiveness while designing your screens..
- We need only DESKTOP screens for this challenge and have the as 1024px (width) and height as required (no need to design the mobile screens).
- For this challenge we are providing design direction document which should help you to get started.
- Please follow the colors from the color palette given in design direction document and use a placeholder for logo.
- Font is open to the designers
- We have provided few reference links for Landing pages and Dashboard/portal, please see below..
- We have provided some inspirational images, please use it as a reference and DO NOT COPY.
- DO NOT COPY the wireframes exactly - they are meant to help guide you and let you understand the application the audience would like to see designed. Think about the user experience/user interactions and show us your solutions! You can do something different or might make more sense!
The Cloud Dealer Customer (Scenario):
Jen works for the government and has been tasked with building out a cloud based solution. She learns of Cloud Dealer and goes to www.clouddealer.com and gets a good overview of what Cloud Dealer is, what service it provides, the benefits of Cloud Dealer and why she should use it to shop for her cloud based solution.
Jen decides to enroll for the service and begins browsing the service options that Cloud Dealer provides. She isn’t sure what she should be looking for so she follows the navigation help cue and goes thru an intuitive stepped process where she is asked questions about her needs. As she answers the questions Cloud Dealer is recommending solutions that best suit her needs. After getting more comfortable with the site, Jen starts to interact with the Market Place page and quickly narrows down her solution options based on intuitive filters and search cues. At a quick glance Jen is able to become informed, make comparisons between solutions, and add solutions to her shopping cart.
After completing her solution request Jen logs back into the Cloud Dealer portal and starts managing her solutions. She can easily organize her solutions by project folders and manages solutions and users for each project. She can easily add a solution to a project folder or create a new project and browse solutions that best fit her project needs.
Required Pages:
1.0 Cloud Dealer Marketing Info Landing Page
- This is a marketing driven page that serves as an introduction to the Cloud Dealer solution.
- It provides high level detail and funnels site users down their appropriate paths to relevant content.
- This should be a long scrolling single page design as well as consider using parallax slider animations.
- Other possible page content could include quotes from Cloud Dealer users, pricing information, overview of management capabilities, featured solution, browsing services, and recent updates.
- Main calls to action are to browse Cloud Dealer Marketplace, Provision a new service, Enroll, and Log In.
- We like the overall design & graphics styles, look & feel from these references: https://www.behance.net/gallery/18443341/Wunder- pass-Landing-Pages, https://roboco.in and https://squareup.com/?sro=1
2.0 Cloud Dealer Portal (Dashboard)
- After a user has successfully logged in or enrolled for Cloud Dealer they are taken to the Portal Page.
- The home page for the portal can be a user dashboard where a user can manage their applications as well as create and provision new services.
- Possible dashboard content could include “my projects, order history, my services, add a service, featured solutions, browse solutions “Marketplace”.
- Please go through the designs we like for dashboard/portal references (given below)..
3.0 Cloud Dealer Marketplace
- A user is brought to a landing page that has by default all the available services within Cloud Dealer organized by various categories.
- A user can initiate a search or interact with service catalog filters (blueprints, web services, applications, databases) to find the service that they are looking for.
- A user can also provision a service from bundled service packages that are popular services offered via Cloud Dealer.
- You can refer this site https://ace.ng.bluemix.net/#/store for the type of services that might be sold through this cloud dealer site.
- Please go through the designs we like for dashboard/portal references (given below)..
4.0 Product Details
- After a user has browsed the service catalog they click on a service and are displayed with a product detail page.
- This “Amazon-Like” display has product specifications, reviews, rating, usage metrics, and ability to “add to cart”
- A user is also presented with a list of products and services that are related to this product
- Please go through the designs we like for dashboard/portal references (given below)..
5.0 Shopping Cart
- After selecting the desired services, a user is able to review their selections in their shopping cart page.
- They can edit or delete items and submit their order.
- Please go through the designs we like for dashboard/portal references (given below)..
6.0 Cloud Dealer Management Console
- This page is like a dashboard that allows user to manage the projects and also the users associated with individual projects.
- Should have the ability to visualize the key things, come up with thoughts on that.
- Please go through the designs we like for dashboard/portal references (given below)..
6.1 Cloud Dealer Management “Projects” (Optional Page)
- Projects in this account will be managed by the user.
- Allow the user to click on a project and view more details about it.
- What other options should be given here, so as to allow the user to manage it?
6.2 Cloud Dealer Project Detail
- A project detail screen shows the users associated with a project as well as the cloud solutions that are being used within that project.
- An admin would have control over items within a project.
- We have provided project details screens for content references (Project Details.png.zip)..feel free to improve them but make sure to include those details.
6.3 Cloud Dealer Management “Users” (Optional Page)
- An admin should be able to manage the users of the projects, add/remove them from the project
7.0 Pricing Comparison (Optional Page)
- This is the comparison page.
- A user is able to see side by side comparison of recommended products as well as selected products.
References:
For pages 2.0 to 7.0, we like the look & feel and also the functionality shown in the below reference links
- For Dashboard/Portal: We like the overall design & graphics styles from these reference links: Reference 1, Reference 2 and Reference 3
(Please DO NOT COPY, just use it as a reference)
Target Audience
- Business end-users (non-technical) who would deploy applications and workloads (not an operations type engineer)
Judging Criteria
- How well you design the provided design challenge
- Cleanliness of your graphics and design.
- Design and User Experience.
Submission & Source Files
Preview Image
Create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color 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 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 or Illustrator and saved as layered PSD/AI files.
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics, images (sizes or colors) or modify overall colors.
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.