Challenge Summary
There is an interesting chance to design the concept of an Input Method Editor for Android (custom keyboard). We need you to come up with ideas and provide screens that show how this custom keyboard behaves. Welcome!
Round 1
For your R1 deliverables please submit the following requirements under “Concept Design Requirements” section:
1) Normal Key-size Keyboard at bottom.
Mobile portrait and landscape (480x800 / 800x480). Tablet potrait (720x1280).
2) Large Key-size Keyboard at bottom.
Mobile portrait and landscape (480x800 / 800x480). Tablet potrait (720x1280).
3) Normal Key-size Keyboard docked left.
Mobile portrait and landscape (480x800 / 800x480).
4) Large Key-size Keyboard docked left.
Mobile portrait and landscape (480x800 / 800x480).
5) Normal Key-size Keyboard docked right.
Tablet portrait and landscape (720x1280 / 1280x720).
6) Large Key-size Keyboard docked right.
Tablet portrait and landscape (720x1280 / 1280x720)
7) Settings Screen. Mobile portrait only (480x800).
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 the mentioned requirements under “Concept Design Requirements” section plus any updates from client feedback.
1) Normal Key-size Keyboard at bottom.
Mobile and tablet, portrait/landscape.
2) Large Key-size Keyboard at bottom.
Mobile and tablet, portrait/landscape.
3) Normal Key-size Keyboard docked left.
Mobile and tablet, portrait/landscape.
4) Large Key-size Keyboard docked left.
Mobile and tablet, portrait/landscape.
5) Normal Key-size Keyboard docked right.
Mobile and tablet, portrait/landscape.
6) Large Key-size Keyboard docked right.
Mobile and tablet, portrait/landscape.
7) Settings Screen. Mobile portrait only.
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 design screens that show how a custom keyboard for Android works. It’s an idea+design challenge rather than a graphic design challenge overall, it’s interesting. You won’t design a mobile application, instead you’ll design a keyboard that behaves in certain ways.
We want to develop an input method editor for Android (custom keyboard) flexible enough to work at several resolution screens (smartphones and tablets). This keyboard will help users to feel more comfortable with the device when writing. We need your help to design these screens following a provided baseline concept.
In overview, the main task is focused in thinking about how to distribute/organize the keys from a Keyboard following the described concept below. You’re encouraged to interact with a mobile OS keyboard to have the feeling of how these kinds of “apps” (Input Method Editors) work, especially with Android. See a good sample of a custom keyboard for Android (see the screenshots in the link).
Branding and Guidelines
- You’ll design the keyboard behavior at two different devices resolutions with portrait and landscape views; mobile portrait / lanscape (480x800px / 800x480px) and tablet portrait / lanscape (720x1280px / 1280x720px).
- The screens should have a phone/table, however it’s not necessary. Since this is a concept design contest we focus on having a working keyboard at the required screen dimensions.
- The brand/look of the application will be the default Android Ice Cream Sandwich UI (we care about the keyboard component only). You can use online resources or design your own keyboard (Android default look duplicate).
- Use web-safe fonts (default Android font is allowed). Declare your fonts according to the Studio font’s policies.
Concept Design Requirements
As mentioned below, the goal is to design an Android keyboard that cover certain features. We have a concept for you to explore and represent graphically. Make sure to ask any amount of questions in the forums.
Basic User Story
- When operating with single hand with a big display, I can rotate phone in Z axis towards to the side where my hand is, plus some gesture like shake it a little bit and the keyboard will float to that side.
- When I need to switch input mode, I can rotate phone slightly on X or Y axis (to left or right side in case of Y axis) to switch mode. And the mode to be switch should be configurable.
- When display is small, I can select to display a half keyboard only, and rotate phone slightly on certain axis to switch which half keyboard it displays.
See sample graphic of an Android device axes, just so you know and get the idea better of the device positioning.
As you can see, it’s about positioning and sizing the keyboard depending on how the hand (s) is/are holding the device (grabbing mode), either phone or tablet. Now, the concept you need to represent (see mockups.zip).
Keyboard Positioning Modes
Keyboard will operate in 3 modes regarding to positioning.
- Mode 1: when grabbing with two hands the keyboard is shown in the bottom (regular display).
- Mode 2: when grabbing the device with the right hand only the keyboard moves and docks to the right side of the screen.
- Mode 3: grabbing the device with the left hand only the keyboard moves and docks to the left side of the screen.
The positioning modes (bottom, dock right/left) are activated by gestures. The custom keyboard has 3 gestures that could trigger events, basically rotate a little and turn back at X, Y and Z axis. This is for your information; you don’t need to design anything about this.
Keys Features
Keyboard will be displayed at two different sizes, triggered by gestures/events: large key size and regular key size.
- In regular it’s just a common keyboard. In large size keys are bigger and only half of keyboard is displayed.
- The one hand mode (left/right) should be smaller in width then 2 hands mode, and its width should be fixed. Both size modes should have same height.
- The most common configuration for keys is QWERTY. Keep that in mind when assigning the keys positions considering the available space. A full QWERTY keyboard is possible even at one hand mode for tablet devices, but might not be good idea for smart phones.
- Since all of the keys may not be visible at a first glance when large mode is active (depending on the device screen) the user needs to do a gesture or something else to switch display parts and sees the rest of the keyboard. Maybe inner scrolling, a button, a gesture; we’re open to suggestions.
- There should be a way (probably a keyboard button) to switch Alphabet/Numeric character types.
- There should be a way (probably a keyboard button) to switch between Chinese and English language. For this contest you are going to represent characters in English only, not Chinese though.
Settings
There should be a settings button in the keyboard that triggers a configuration screen (a separate generic Android settings screen) where a user can map events to gestures and configure some features.
- Make this my default input method (checkbox).
- Set default language (list box, English - Chinese).
- Display keyboard in large size always (check box).
- Rotate around Z axis event (list box of 4 events).
- Rotate around X axis event (list box of 4 events).
- Rotate around Y axis event (list box of 4 events).
- List of 4 events refers to a way to pick among: Switch Alphabet/Numeric, Switch Left/Right Docking (if in one hand mode), Switch Left/Right part of Keyboard (if in large key mode), and Switch Between Chinese and English.
We are open to suggestion on how to layout and assign UI controls to this screen. Keep it simple.
Deliverables for Review
By the end of the contest we expect to receive the following items/screens in the required dimensions (mobile and tablet) in portrait and landscape orientation.
1) Normal Key-size Keyboard at bottom.
2) Large Key-size Keyboard at bottom.
3) Normal Key-size Keyboard docked left.
4) Large Key-size Keyboard docked left.
5) Normal Key-size Keyboard docked right.
6) Large Key-size Keyboard docked right.
7) Settings Screen (portrait only).
Target Audience
Our target is the global Android users’ population. People who wants to an easy-to-use keyboard.
Judging Criteria
- Capability of exposing the concept into visual screens.
- How intuitive is your solution?
- 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.