Challenge Summary
Welcome to CSFV Gaming Site Storyboards Revamp contest. Just days ago we designed our storyboards concept. Now we want this concept to be revamped with high quality graphics, icons and special details to make it look more complete. Come and join!
Round 1
For your R1 deliverables please submit the following screens:
- Home
- Public Profile
- Posted Games
- Logged in Home (CSFV from wireframes)
- Register
Feel free to add some notes (jpg or text file) to comment your design features for the client.
Number your screens (01, 02, 03 etc.) – it’s easier to review.
Round 2
Final design will contain all the requested screens plus any updates from client feedback.
Feel free to add some notes (jpg or text file) to comment your design features for the client.
Number your screens (01, 02, 03 etc.) – it’s easier to review.
The primary goal of this contest is to redesign and complete some pages of the CSFV Gaming Community Site. We will be holding several more contests to build the remaining pages of this very large site, so get involved at the beginning! We need you to come up with stunning graphics for the existing site; you will keep the existing layout but redesign the UI elements of the pages to give them a sharp look.
Please, carefully READ the overall site concept so you can understand what this site is about. Use the attached submission and wireframes as guidance for the requirements.
What is CSFV?
The Crowd Sourced Formal Verification (CSFV) program seeks to make formal program verification more cost-effective by reducing the skill set required for verification. The approach is to transform software verification (testing) into a more accessible task by creating a game that reflects the code model. Basically, the users will be playing games and at the same time they will be making software verification. We are looking to use the tool to verify open source software.
Overall site concept
We envision this site as a global community with sub-sites focused on games, a nice mix of social features and heavy 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, the main/global website will work as an aggregator of the sub-sites and as a Social network community, 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.
Global website will have the global items like activity stream, member profiles, registration, etc, more details below. The sub-site will be specific to that sub-site, for example, news, leader board, game content, contests, tournaments, forums/discussions, blogging, tutorials, how-to play guides, shared solutions, etc. Global website will have the same specific items as in sub-site but will be more like an aggregator for the 5 sub-sites, which means there could be some differences in how content in page are displayed, for example, a sub-site may have a leader board page with a single leader board that is filtered according to tournament/contest, member, date, while in global site it will have more filtering options, i.e. filter based game type.
This description is meant to guide you on how the site works. This contest only focuses on redesigning the provided storyboards and creating some new screens.
Branding and Guidelines
- Use a place holder for the site name/logo.
- Use web-safe fonts for the pages content.
- Your design must fit 1024 pixels wide screen resolution.
- Colors are open to designers. However we don’t want to see dark or military colors.
- Think of web 2.0 when you’re creating your solution. We want to appeal to teens, and the general population.
Storyboard Requirements
Overall
- Use the attached submission as reference for layout, menu, widgets and positioning of UI elements. Keep the same layout and composition, that’s mandatory, it has to be simple and neutral.
- You must redesign all the UI elements from all of the screens to make the page look more professional and sharp. By UI elements we mean icons, buttons, widget shapes, menu, forms.
- We’d like to use some vivid colors; you can change them but keep the overall scheme and a simple background. You must redesign icons, improve the buttons, make good use of spacing, borders, shapes, everything you need in order to make the overall design look professional and elegant, and again, keeping the same layout and composition of UI elements.
- The content inside the pages can be improved if they are properly formatted, playing with font families, font sizes, font colors, tables, the buttons inside, etc.
Notice we’re not attaching the original PSD source files, just the PNG screens. This is on purpose because we want you to put thoughts when you’re redesigning the UI elements, we don’t want to keep the current ones as they are right now.
Home
- Implement the carousel concept design attached. Follow the exact same reference BUT you have to adapt or “skin” the carousel to your own design, make it feel part of the overall look. Use the provided game screenshots in here.
- Add social media links at top and bottom of all pages (Facebook, Twitter, Google, etc). This should be displayed in all the pages.
Public Profile
- Show redesigned “Personal Wall” only.
- Notice the blue icons on the stories are supposed to be pictures from users, please fix that.
- Redesign the tabs to navigate the rest of the elements of the page.
- Show “Message” and “Add Friend” popups.
News
- Show the redesigned list and details view.
Achievements
- Show the redesigned Leaderboards view only.
- Redesign the navigation for the other items like badges, scores, etc.
Posted Games
- Instead of a regular list of games we want to implement the same home page carousel concept on this space. Make the necessary adjustments to make it fit and look good regarding to empty space.
Logged in Home (CSFV from wireframes)
- Notice there is a floating chat at the bottom of the page. It needs improvements too.
- Show the interactions/views on the header tool bar (friends, notifications, messages).
Own Public Profile
- Show the redesigned Personal Wall, Messages and Friends pages.
Sign In
- This is a new page. Add it to your submission.
Register
- This is a new page. Add it to your submission.
Logged In pages
- Besides Home (CSFV from wireframes), show the following pages when the user is logged in: News, Achievements, Tournaments, Posted Games.
- These pages belong to “CSFV” section on the left menu of the wireframes. Just add the logged in header and footer (chat) to the mentioned pages.
- On Leaderboard page you need to show a player's own score and relative position.
Target Audience
Casual gamers, everyone who likes games from children to adult persons.
Judging Criteria
- How much did you improve? We want existing design to look professional.
- Quality of redesigned elements.
- User Experience.
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.