Challenge Summary
Welcome to CSFV Mini Site 3 Storyboard Design Contest. We need you to design the look and feel of a game mini site. It has three simple pages only and you will be using an existing design as guidance/base for your work. Don’t let the requirements text length fool you, it’s really simple. Come and join!
Round 1
For your R1 deliverables please submit the following screens:
1) Home
2) Home Facebook
3) Logged in Home
Round 2
Final design will contain all the requested screens plus any updates from client feedback.
1) Home
2) Home Facebook
3) Logged in Home
The primary goal of this contest is to design the look and feel of three pages for a game mini site. We need you to keep the same flow/layout of the current storyboard design but also add special customized details in order to make this game page unique at certain level.
There is a global community website with sub-sites focused on games, a mix of social features and large information delivery (social network + gaming website). The website concept is about breaking it down into global website and sub-sites, we will have 5 unique games, and each game will have a dedicated sub-site with content specific to that game, that means the sub-sites will have the same layout and navigation of the global website with different theme/colors/styles but delivering content specific to the game.
This description is meant to guide you on how the site works. This contest only focuses on designing pages of the game mini site. You are provided with the global community site storyboards for visual reference overall, with the game mini site wireframes for layout requirements, and a template to work with.
Branding and Guidelines
- Use Minisite.psd as template for your mini site design.
- See CSFVStoryboards.zip for graphic reference about page elements of the global site overall.
- See GameReference.zip for graphic reference about the game branding. It contains two sample logos (use any of them) and a game screenshot for visual inspiration.
- You can modify the page height but NEVER the width.
- Colors and overall feel should match the game reference design.
- Use web-safe fonts for the pages content. Declare your fonts according to the Studio font’s policies. If you don’t have any of the fonts from the provided storyboard replace them with Arial and add a note about it. You will be asked to replace the font if you become a winner.
- Show all the hover states for all the new UI elements you create or modify (buttons, hyperlinks, dropdowns, etc).
Storyboard Requirements
Game brief
This is a thoughtfully-paced puzzle game, where the player is a xenobotanist, a discoverer of strange and beautiful new plants on a mysterious island. As a scientist, they must study the plants and how they grow, learning the hidden patterns in the plants, to build logical structures that describe the ‘true’ nature of the plants. Players send their findings off to the xenobotany Headquarters, and receive accolades, awards, and greenhouse upgrades for especially clever solutions.
The aesthetic of the game is tuned for the casual gamers markets. The color scheme is rich, dark wood colors, like mahogany, antique-gold detailing, soft cream backgrounds, and bright, but translucent stained glass flowers as accent colors. Botanical elements and details are welcome. Avoid black, grungy or heavy machinery elements and think instead of a well-polished Victorian greenhouse
Overall Requirements - Customization Guidelines
- See MinisiteGuidelines.zip. Especially MinisiteGuidelines_4.jpg shows the work design areas.
- Replace “minisite logo” with any of the provided logos.
- Navigation menu is: Home, Play Game, News, Forums.
- Design 4 navigation icons to match the game branding. You are free to suggest the dimensions (all equals), shapes and colors. Show how they look when they are “selected” or “active”.
- Design a background that will be used in all the pages of this mini site. This background should be large enough to cover the whole area like shown in the template sample. The design height should be flexible in the way to solve the problem that all pages won’t have the exact same height, so the design should adapt to the different heights of the pages. Width should be 1200 pixels at least.
- Background style should be strongly associated with the game branding. See the game reference images and read the game description to get an idea of how it looks. DO NOT JUST COPY any of the game images, design something unique using the game images as reference only.
- You are allowed to change font colors and sizes.
- Don’t change any font family (except if it’s one you don’t have in your system).
- Design-rethink the widgets header backgrounds to match the game branding.
- Design-rethink the widgets content backgrounds to match the game branding.
- Design-rethink the widgets icons to match the game branding (optional).
1) Home
- See “1.infographic” in the provided template.
- Place the background and updated navigation.
- Place a “Google Play”, “App Store” and “Play Now” buttons above and below the infographic area.
- Keep the infographic placeholder, exactly as it is - don’t touch!
2) Home Facebook
- See “Home (Not logged in), logged into FB” from wireframes.
- Same as #1 (Home) but add the facebook common friends on the area above the infographic. Use placeholder for the pictures, NOT real pictures!
3) Logged in Home
- Design this page following the layout found in the wireframe page “Home (Logged in)”.
- When clicking “How to play” it should display a popup with the infographic (use a placeholder).
- You can reuse/redesign widgets from existing global site pages such as home, logged in home, help center, and any other resource you find useful.
- Make sure to show chat and logged in header (make visible “LOGGED IN” layer group from the template).
Note: there is footer with 5 games in the wireframes. Ignore that for your design.
References
The client mentioned some sites that might represent what they are looking for. The following is just for reference, DON’T copy anything.
- http://www.abneypark.com/2008/index.htm
- http://www.drgrordborts.com/dr-grordbort-s-infallible-aether-oscillators-where-science-meets-violence/
- http://www.allmystery.de/i/t2N163L_281959myst4oj3.jpg
Target Audience
Thoughtful, scientifically-minded puzzle gamers. People who enjoy Sudoku and those kind of games.
Judging Criteria
- Capability of making the design customized to the game related graphics.
- Quality.
- Originality.
Submission File
All requested contest requirements/screens as JPG or PNG files at 72dpi.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD files.
Preview Image
Create a 1024x1024 JPG or PNG file in RGB color mode and place a screenshot from your submission within it.
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.