Challenge Summary
Welcome to “Cloud Site Web Design Challenge”. In this challenge, we need your help to create look and feel for our upcoming cloud site. You are provided with wireframes (online) and some sample design from our side as your branding and visual references. At the end of this challenge, we are looking a complete set of pages design that able to reflect our branding. Join us now!!
Round 1
Requirement 1 - 5 as stated in challenge details for client review
Round 2
All requirements as stated in challenge details with client feedback applied
This is an internal education site for our client employees to learn about the cloud and our client cloud capabilities, services, resources, education and certification programs. Primarily, this site must convey that there is a LOT going on the cloud and that our client is right in the middle of it.
This challenge purpose is to create a web pages storyboard for the cloud site. For your references, the wireframes can be seen online from this link : http://eupvxv.axshare.com/. Don’t worry, we don’t need all pages from the wireframes to be created, only 8 pages design requires to be create in this challenge. Please see more details below :
Branding Guidelines
- Font and Color is opent to designer, web safe font is priority.
- Please use the wireframes for any layout and content elements needs to be create in your design.
- Create the design for PC device. However, please also think about responsive aspect when create your design, we’re gonna need all elements to be responsive for other devices in the future.
General Requirements
- Do not copy layout from sample_design folder, it’s just for references.
- There are a lot of carousel needs to be created in the site, show us your creativity to create an easy to use carousel concept that bring a great user experience for our audience.
- The design needs to be the "METRO" style with panels similar to how it is shown in the already provided screenshots. Also if you are familiar with windows 8, this style is used for the Start menu. Please ask if you are unclear on what this style is. It should catch the user's eye and tease them in to clicking for more.
- iStockphoto is allowed in this contest, please see Studio stock photos policy carefully if you want to include it in your submission.
- You can use this link for inspiration on your design. We really like it. While it is a good use of color it might be a little too much color for the cloud site; we want the cloud site to be more professional looking, but this is still a good reference: http://innovation.bah.com/innovo/
- We also want an RSS feed so there should be some logo/button/link to that feed in the screens.
- For carousel parts, big carousel should have an image, headline/title, and teaser text while the small carousel should have image, smaller font for headline/title and teaser text if necessary. Each carousel will have maximum 5 slides content.
Screen Requirements
1. Homepage
- Middle content contains 3 different section, what is the cloud, what are our capabilities, and how did I get involved, Create some icons for these area preferred. Please see the PPT attachment which shows the icons designed previously (there are 8 of them). These icons represent images that we understand to represent the concepts/capabilities on the site, however you should be redesigned to fit the new site design, and the other new icons designed to match.
- Industry News is a group of news announcement.
- We're also need screen variation to be created, please use Resources Screen for the alternative design, where some addition of text placed above the metro panel
2. What is the cloud page (cloud 101)
- Pay attention to sub menus in this page, all pages except homepage will have sub menu.
- This page should be create in 2 column page style where main content put on the right side and sidebar will have callout box (carousel).
- History of cloud computing and cloud ecosystem should have it’s own image placeholder.
3. History of the cloud page
- Two columns page with callout box sidebar carousel, the callout box should use metro style.
- The main content (on the left side) should have variation design like the following :
* One page that have image stretching all over the left side (history page).
* One page that have one image in the center of the page (Training detail page).
* One page that have one image in the right side of the page (Case Study detail page).
* One page that have no image (Capability Name page).
4. Cloud capabilities page
- Two columns page with list of capabilitiy name
5. How to engage page
- Two columns page with opportunities list on the right side.
- Page Description on top of the main content.
- Three section should created side by side (cloud training, learning & development, cloud certifications.
6. Case studies page
- Once Column page (ignore the callout box).
- Create case studies content on the left side with 3 list of sub content.
7. News page
- Two column page with Industry news section on the right side.
- Main content should have short description to explain about the page purpose.
- There should be 3 different section contains latest news from the following category :
o Recent wins
o New Opportunities
o Yammer
8. Contact us Page
- A contact form design.
Target Audience
Our target audience is internal client employees, but further it breaks down in to subgroups:
- 10% have no idea what the cloud is and are there to find out what it is and why it is a big deal - this site will teach them about what the cloud is and what capabilities client has, and mostly will show that there is a lot going on
- 60% have their own customers which are asking them questions related to the cloud or what cloud capabilities this client has - this site will help them answer questions and explain about the different cloud capabilities at client
- 20% have an understanding of the cloud and some of the client capabilities and are coming to the site to get information on training, they want to get trained and certified to work in this sector
- 10% are already fully immersed in cloud related activity at client and will use the site as reference and to branch in to new areas
Judging Criteria
- How well you design the Interface/User Experience.
- Look and feel of the design.
- Ease of implementation of the design.
- Cleanliness of your graphics and design.
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.
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 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.