Challenge Summary
Welcome to the "IBM - BringIt Innovation Crowdsourcing Platform Design Concepts Challenge". We are looking to create a competitive and collaborative crowdsourcing platform for completing tasks that allows project managers to access the right resources across our large organization and increase engagement by providing an opportunity for consultants to find work that interests them most. We want you to focus on the UI/UX interactions and bring simple UI solutions to how this community could work. What should the user see and experience when using the this platform?
We are providing wireframes - do not copy the wireframes directly. The wireframes are meant as simple guidelines around the content and features for this platform. We are open to your creative and innovative design ideas!
01. Homepage Screen
02. Sign In Screen
03. Dashboard Screen
04. Create a New Task Screen (Poster)
05. View Detail Task Screen
06. View Submitted Deliverables Screen (Poster)
- Required: Provide a MarvelApp presentation of your design to help us understand your design concept.
- Request a MarvelApp prototype/project from copilot fajar.mln or adroc (via forum or email)
- Make sure your pages are in the correct flow/steps. Use correct file numbering. (00, 01, 02, 03)
01. Homepage Screen
02. Sign In Screen
03. Dashboard Screen
04. Create a New Task Screen (Poster)
05. View Detail Task Screen
06. View Submitted Deliverables Screen (Poster)
07. Project Search Screen
08. Submit a Task Screen (Submitter)
09. Profile Screen
10. Other Screens
- Required: Provide a MarvelApp presentation of your design to help us understand your design concept.
- Request a MarvelApp prototype/project from copilot fajar.mln or adroc (via forum or email)
- Make sure your pages are in the correct flow/steps. Use correct file numbering. (00, 01, 02, 03)
Background Overview
The goal of this challenge is to create a competitive and collaborative visual design experience around completing tasks that allows project managers to access the right resources across a large organization and increase engagement by providing an opportunity for consultants to find work that interests them most. We are looking to create an internal crowdsourcing platform.
User Stories
Users on the platform can share a ‘help wanted’ ad for a discrete task with a deadline. Other users can compete to offer the best completed deliverable by the deadline. The poster can select the top three deliverables and shares with participants. The top three submissions also earn points that can be put toward title and prizes.
There will be two workflows
- Posting of tasks
- Completing of tasks
Design Considerations
- Review the provided branding guidelines/colors
- What should the priority features be?
- How quickly could a user find what they are looking for or post new tasks?
- The interface will need to be easy and intuitive to navigate (think Community!)
- Give importance to the overall layout and think on how a user would interact with the content on the page.
- Show all the screens and provide a user flow/click-path and navigation, so we can see how the interactions fit together in the application
Design Requirements
- Plan for responsive design: We are currently focused on Desktop for this challenge
- Desktop Resolution: minimum 1280px width with height adjusting accordingly
- Upload your screens to MarvelApp for review and to showcase the experience (ask for MarvelApp prototype/project from copilot or PM in challenge forum)
Branding Guidelines
- All designs should conform to the IBM Northstar Design Language: https://www.ibm.com/standards/web/design/
Required Pages
For this challenge, we are looking for the below pages to be designed/considered in your concepts.
01. Homepage Screen
Reference WF - Screen 2
- By default, this page will appear every time user arrives at the BringIt portal.
- There should be some marketing about what is the “BringIt” community and a step-by-step about the BringIt flow on the home page
- The user can select whether they want to search for tasks or post a new task from this screen.
- Be aware of the page fold - show content above the page fold and content below the page fold. Important interactions and call to actions should be above.
02. Sign In Screen
Reference WF - Screen 4 (Left screenshot)
- Before being able to use the full features of this platform, the user will need to login/sign in using their IBM credentials.
- The user will need to provide their intranet ID and password to be able login to the platform.
- Provide "Forgot Password" link
- Provide error login scenario for a wrong credential attempt.
03. Dashboard Screen
Reference WF - Screen 4 (Right Screenshot)
- This page will show summary details and recent interactions in the platform.
- Do not use the wireframe layout for your concept - think about the navigation and content and how it should be presented.
- Show step by step information about interactions for managing tasks from start to finish.
- User will be able to create new post via the "New" link/button
- Open tasks are tasks owned by the user
- Favorite tasks are tasks the user has saved
- Completed tasks are tasks that a user has provided a submission
- Future requirement – points leaderboard
- A user should be able to quickly search projects from this page
- Need to listing all tasks (active and completed) in this screen.
04. Create a New Task Screen (Poster)
Reference WF - Screen 5 (Left Screenshot)
- User can post a new task from this screen
- Form contains task details such as Task Type, Client, Due Date, Task Description, and Tags.
- Task type will be dropdown with options value includes RFP, Research, SME, and Other
- Task description is a free form field; project tags are user-generated, separated by commas
- The "Publish" button makes the post visible to all users via search results
- Might need to have draft features button to save unfinished task draft.
- Consider adding preview interactions where user can check their Task completeness before publish the Task.
05. View Detail Task Screen
Reference WF - Screen 5 (Right Screenshot)
- Once user publish the task, it will appear in the project/task list and all user (both poster and submitter) will be able to find and read the task details.
- Need to have communication area between Poster and other users where they can discuss anything related to the task details.
- Poster (user that post the task) will be able to open/read the Task details and edit them if necessary (provide edit screen)
- Poster also will be able to manage the Task via this screen, able to see submitted deliverables from other users, check the due date, etc.
- Submitter will be able to see "Submit" button from this screen to submit their solution.
- Provide Detail task screen for both Poster and Submitter.
06. View Submitted Deliverables Screen (Poster)
Reference WF - Screen 6
- Poster will be able to see list of submission deliverables from other users in this screen
- Poster may view submissions at any time
- Submissions will be encouraged via ‘box’ (3rd party apps) – view attachment will take the user to the box link with the file
- User will be able to download the deliverables submission
- Show submitter name, email, and link to go to submitter profile
- Poster will be able to judge the deliverables and decide the winners for this task, provide selection features (1st to 3rd placements) and create interaction screens to select the winners.
07. Project Search Screen
Reference WF - Screen 8
- Users can search for tasks in the search bar on the dashboard and it will be redirected to this screen.
- Provide search bar in this screen so user can perform anytime they want.
- User will be able to see any active or past Task/Project in this screen.
- "View" takes the user to the project detailed task page
- For Project/Task List, show thumbnail of the task type, name of the task, and tags related to the task
- There will be an advance filter area in this screen where user can specify their search criteria.
- Refer to the wireframes for more details about the content.
08. Submit a Task Screen (Submitter)
Reference WF - Screen 9
- We need to add how other users (submitter) can submit their task solution.
- User can open this screen by clicking submit button from detail tasks screen
- Submit button will triggers a pop-up window that allows the user to post a link to their deliverable on ‘box’
- Once the user provide the ‘box’ link, it appears in the "View submissions" page for the project owner as pending
- "Favorite" add the task to a user's home page
- Future requirement – comments section for Q&A on project with poster and submitters
09. Profile Screen
No Wireframes
- User will be able to see other user profile from this screen.
- Show profile picture, list of latest project/task activity, skills, and achievement in the platform.
10. Other Screens
- Think of another screen that will be useable for this platform
- Support/Report screen? Help Screen? Etc.
Important:
- Keep things consistent. This means all graphic styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance
Documentation
- wireframe.zip: as references for content and our thoughts on the workflow (not for layout)
Target Audience
- IBMers (Our employee around the world), they will have access to both workflows - posting new tasks and completing tasks.
Judging Criteria
- Design concepts! Show us your UI/UX thoughts on this.
- How well you utilized the IBM Northstar Design Language
- How well you plan the user experience and capture your ideas visually.
- How well you interpret the requirements and show us new ideas and concepts.
- Cleanliness of your graphics and design.
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
Submit JPG/PNG for your submission files.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD file, or Adobe Illustrator as a layered AI file.
Final Fixes
As part of the final fixes phase you will be asked to update the style tile to reflect any new elements that you have added to the design. You may also be asked to modify your graphics (sizes or colors) or modify overall colors. We may ask you to update your design or graphics based on checkpoint feedback.
We are providing wireframes - do not copy the wireframes directly. The wireframes are meant as simple guidelines around the content and features for this platform. We are open to your creative and innovative design ideas!
Round 1
Submit your initial design for checkpoint feedback01. Homepage Screen
02. Sign In Screen
03. Dashboard Screen
04. Create a New Task Screen (Poster)
05. View Detail Task Screen
06. View Submitted Deliverables Screen (Poster)
- Required: Provide a MarvelApp presentation of your design to help us understand your design concept.
- Request a MarvelApp prototype/project from copilot fajar.mln or adroc (via forum or email)
- Make sure your pages are in the correct flow/steps. Use correct file numbering. (00, 01, 02, 03)
Round 2
Submit your final design plus any checkpoint feedback01. Homepage Screen
02. Sign In Screen
03. Dashboard Screen
04. Create a New Task Screen (Poster)
05. View Detail Task Screen
06. View Submitted Deliverables Screen (Poster)
07. Project Search Screen
08. Submit a Task Screen (Submitter)
09. Profile Screen
10. Other Screens
- Required: Provide a MarvelApp presentation of your design to help us understand your design concept.
- Request a MarvelApp prototype/project from copilot fajar.mln or adroc (via forum or email)
- Make sure your pages are in the correct flow/steps. Use correct file numbering. (00, 01, 02, 03)
Background Overview
The goal of this challenge is to create a competitive and collaborative visual design experience around completing tasks that allows project managers to access the right resources across a large organization and increase engagement by providing an opportunity for consultants to find work that interests them most. We are looking to create an internal crowdsourcing platform.
User Stories
Users on the platform can share a ‘help wanted’ ad for a discrete task with a deadline. Other users can compete to offer the best completed deliverable by the deadline. The poster can select the top three deliverables and shares with participants. The top three submissions also earn points that can be put toward title and prizes.
There will be two workflows
- Posting of tasks
- Completing of tasks
Design Considerations
- Review the provided branding guidelines/colors
- What should the priority features be?
- How quickly could a user find what they are looking for or post new tasks?
- The interface will need to be easy and intuitive to navigate (think Community!)
- Give importance to the overall layout and think on how a user would interact with the content on the page.
- Show all the screens and provide a user flow/click-path and navigation, so we can see how the interactions fit together in the application
Design Requirements
- Plan for responsive design: We are currently focused on Desktop for this challenge
- Desktop Resolution: minimum 1280px width with height adjusting accordingly
- Upload your screens to MarvelApp for review and to showcase the experience (ask for MarvelApp prototype/project from copilot or PM in challenge forum)
Branding Guidelines
- All designs should conform to the IBM Northstar Design Language: https://www.ibm.com/standards/web/design/
Required Pages
For this challenge, we are looking for the below pages to be designed/considered in your concepts.
01. Homepage Screen
Reference WF - Screen 2
- By default, this page will appear every time user arrives at the BringIt portal.
- There should be some marketing about what is the “BringIt” community and a step-by-step about the BringIt flow on the home page
- The user can select whether they want to search for tasks or post a new task from this screen.
- Be aware of the page fold - show content above the page fold and content below the page fold. Important interactions and call to actions should be above.
02. Sign In Screen
Reference WF - Screen 4 (Left screenshot)
- Before being able to use the full features of this platform, the user will need to login/sign in using their IBM credentials.
- The user will need to provide their intranet ID and password to be able login to the platform.
- Provide "Forgot Password" link
- Provide error login scenario for a wrong credential attempt.
03. Dashboard Screen
Reference WF - Screen 4 (Right Screenshot)
- This page will show summary details and recent interactions in the platform.
- Do not use the wireframe layout for your concept - think about the navigation and content and how it should be presented.
- Show step by step information about interactions for managing tasks from start to finish.
- User will be able to create new post via the "New" link/button
- Open tasks are tasks owned by the user
- Favorite tasks are tasks the user has saved
- Completed tasks are tasks that a user has provided a submission
- Future requirement – points leaderboard
- A user should be able to quickly search projects from this page
- Need to listing all tasks (active and completed) in this screen.
04. Create a New Task Screen (Poster)
Reference WF - Screen 5 (Left Screenshot)
- User can post a new task from this screen
- Form contains task details such as Task Type, Client, Due Date, Task Description, and Tags.
- Task type will be dropdown with options value includes RFP, Research, SME, and Other
- Task description is a free form field; project tags are user-generated, separated by commas
- The "Publish" button makes the post visible to all users via search results
- Might need to have draft features button to save unfinished task draft.
- Consider adding preview interactions where user can check their Task completeness before publish the Task.
05. View Detail Task Screen
Reference WF - Screen 5 (Right Screenshot)
- Once user publish the task, it will appear in the project/task list and all user (both poster and submitter) will be able to find and read the task details.
- Need to have communication area between Poster and other users where they can discuss anything related to the task details.
- Poster (user that post the task) will be able to open/read the Task details and edit them if necessary (provide edit screen)
- Poster also will be able to manage the Task via this screen, able to see submitted deliverables from other users, check the due date, etc.
- Submitter will be able to see "Submit" button from this screen to submit their solution.
- Provide Detail task screen for both Poster and Submitter.
06. View Submitted Deliverables Screen (Poster)
Reference WF - Screen 6
- Poster will be able to see list of submission deliverables from other users in this screen
- Poster may view submissions at any time
- Submissions will be encouraged via ‘box’ (3rd party apps) – view attachment will take the user to the box link with the file
- User will be able to download the deliverables submission
- Show submitter name, email, and link to go to submitter profile
- Poster will be able to judge the deliverables and decide the winners for this task, provide selection features (1st to 3rd placements) and create interaction screens to select the winners.
07. Project Search Screen
Reference WF - Screen 8
- Users can search for tasks in the search bar on the dashboard and it will be redirected to this screen.
- Provide search bar in this screen so user can perform anytime they want.
- User will be able to see any active or past Task/Project in this screen.
- "View" takes the user to the project detailed task page
- For Project/Task List, show thumbnail of the task type, name of the task, and tags related to the task
- There will be an advance filter area in this screen where user can specify their search criteria.
- Refer to the wireframes for more details about the content.
08. Submit a Task Screen (Submitter)
Reference WF - Screen 9
- We need to add how other users (submitter) can submit their task solution.
- User can open this screen by clicking submit button from detail tasks screen
- Submit button will triggers a pop-up window that allows the user to post a link to their deliverable on ‘box’
- Once the user provide the ‘box’ link, it appears in the "View submissions" page for the project owner as pending
- "Favorite" add the task to a user's home page
- Future requirement – comments section for Q&A on project with poster and submitters
09. Profile Screen
No Wireframes
- User will be able to see other user profile from this screen.
- Show profile picture, list of latest project/task activity, skills, and achievement in the platform.
10. Other Screens
- Think of another screen that will be useable for this platform
- Support/Report screen? Help Screen? Etc.
Important:
- Keep things consistent. This means all graphic styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance
Documentation
- wireframe.zip: as references for content and our thoughts on the workflow (not for layout)
Target Audience
- IBMers (Our employee around the world), they will have access to both workflows - posting new tasks and completing tasks.
Judging Criteria
- Design concepts! Show us your UI/UX thoughts on this.
- How well you utilized the IBM Northstar Design Language
- How well you plan the user experience and capture your ideas visually.
- How well you interpret the requirements and show us new ideas and concepts.
- Cleanliness of your graphics and design.
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
Submit JPG/PNG for your submission files.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD file, or Adobe Illustrator as a layered AI file.
Final Fixes
As part of the final fixes phase you will be asked to update the style tile to reflect any new elements that you have added to the design. You may also be asked to modify your graphics (sizes or colors) or modify overall colors. We may ask you to update your design or graphics based on checkpoint feedback.
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.