Challenge Summary
Welcome to IBM - Client Maintenance Support Map Mobile Wireframes Challenge! IBM customers often have Service Level Agreements (SLAs) for their hardware maintenance. In order to fulfill those agreements, IBM must be certain that we have the parts and service engineers available to fix hardware within the time frame specified in the SLA. This application will visualize the data for the user and supports the decision making.
Round 1
Submit your wireframe for a Checkpoint feedback:
1. Navigation
2. Login
3. User Profile Page.
4. Upload a spreadsheet of data.
5. Map View.
Notes.jpg: Any comments about your design for the Client.
Round 2
Final wireframe plus any Checkpoint feedback:
1. Navigation
2. Login
3. User Profile Page.
4. Upload a spreadsheet of data.
5. Map View.
Notes.jpg: Any comments about your design for the Client.
Challenge Details:
This application will show a map with customers and their locations, service engineers and their locations, and hardware warehouses. The user can use the map to determine the options for SLAs for a particular customer, and to make sure that IBM has the appropriate resources within range for each customer's SLA.
We are looking for wireframe (Axure) solutions based on requirements below. We’re also looking to the community to come up with interesting ideas for the workflow - we’re absolutely open to creative solutions!
At the end of this wireframe challenge, we are looking to have a complete solution for the user experience and flow of the application.
Supporting Documents:
- IBM logo (IBM_logo.ai)
- This document describes the app with some sample data at the end (CMS map - design input.ppt).
Wireframe Expectations:
- Produce HTML click through wireframes that can be used to demonstrate all mentioned functionalities as required in each round.
- The website must be very easy to use and intuitive. Keep that in mind when designing your solution.
- You MUST cover all screens mentioned in required new sections below, if any requirement is missing in final submission the client will not take a look at it, so make a checklist for the required
screens to make sure you designed all of them.
- Please show us your proposal as a movie or series of wireframes that communicate the user’s intended interaction with your proposed solution.
- You MUST use wireframes note pane in every single page you design to explain what items are addressed in that page from the documentation, what things you added/changed/removed, use it to make your idea clearer and help the client to give you constructive feedback.
Notes:
- Your solution need use Responsive Design Solution when viewed on Portrait and Landscape view of Tablet device.
- We would like YOU to pay attention to the IBM Design Language: http://www.ibm.com/design/language/
- Your wireframe submission need able to drill down for all page flow
- Show your wireframe solution on Portrait View. Use this screen size (768px x 1024px)
- Feel free to suggest any tools/function that can bring good User Experience for this Mobile Application.
User story:
- Bob is visiting a customer site, and wants to sell the customer an SLA along with the hardware the customer is purchasing.
- Bob opens the app to see what level of SLA might be within range.
- Bob inputs the customer's location (service consumer), and can see, by his default service level, whether it is within the 2 hours radius of the warehouses and service engineer base stations (service providers). He can switch to see what is available within 4 hours or 8 hours. This switch adjusts the service providers’ radius. The customer location is highlighted when it is within the range.
- Bob sees what capabilities are available, and can confidently tell the customer what levels of service are available for his location.
Start-up experience:
- The first time the user comes into the application, they will need to do two things:
-- Confirm their role (Service Engineer or Manager, Seller, or Business Manager (i.e., warehouse manager))
-- Enter some initial data; uploading it from a pre-created document that has information about the locations the user already knows about.
- Once the user has entered that data, the next time they come into the application, they will see the information they have entered plotted on a map. Future logins will bring the user directly to the map, not the
start-up experience.
Required Features:
1. Navigation
- How does the user navigate this application?
- Include navigation that you think fits with this application
- Focus on the priority items and how things should be sized
2. Login
- User logs in to the application using his "Intranet ID" and "Password".
- Please include the IBM logo on this page, as well.
3. User Profile Page:
- This is only for first time users.
- User should select his role:
-- Service Engineer or Manager.
-- Seller.
-- Business Manager.
4. Upload a spreadsheet of data:
- In this view the user can upload a pre-created document that has information about the locations they already know about.
5. Map View:
- The map should be the focus of the UI once past the profile page.
- User can see 2 different elements on the map:
-- Service Providers.
-- Service Consumers.
- The service consumers are items plotted on the map.
- The service providers are plotted on the map as well, but with a radius. The range is based on the selected service level: 2 hours, 4 hours, 8 hours, etc.
- If the "service consumer" is within at least one radius of a "service provider" it can be highlighted (i.e. green) and when not then not highlighted (i.e. Gray scale or red).
- User will be able to view what is available within 2 hours, 4 hours or 8 hours using a filter.
- When one of map elements is selected show basic information about the element.
- We need refresh icon for the map.
- We need logout link or icon.
Learn Axure:
New to Axure? Here are some quick tutorials to help you get started.
http://www.axure.com/learn
Target Users:
- Sales people and service engineers, who interact with customers. In addition, people who manage service engineers, and people who run warehouses may also use this application.
Judging Criteria:
- User Experience of the Client Maintenance Support Map app.
- Completeness and accuracy of the wireframe as defined in the spec requirements.
- How well your wireframes provide a consistent user flow.
Submission & Source Files:
Preview Image
Please create your preview image as one (1) 1024x1024px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Generated HTML files with all the requested contest requirements stated above.
Source Files
Wireframes should be built in Axure. The resulting files should have generated HTML files. Also, all the content must be listed and the pages are linked together to show page flow.
Final Fixes
As part of the Final Fix phase, you may be asked to remove, update, or change some features of the wireframe.
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.