milestone 4 pptx-- responsive prototype

9
Milestone 4 - CloudDesigner Responsive Prototype Collin Aycock Nick Dozier Alice Leung Matt Craig November 4, 2015

Upload: matt-craig

Post on 12-Apr-2017

2.129 views

Category:

Design


4 download

TRANSCRIPT

Page 1: Milestone 4 pptx-- responsive prototype

Milestone 4 - CloudDesignerResponsive Prototype

Collin AycockNick DozierAlice LeungMatt Craig

November 4, 2015

Page 2: Milestone 4 pptx-- responsive prototype

IntroductionCloudDesigner is crowdsource review system created to provide a tool for both designers and engineers to:

Upload their design(s).

Share with the community for feedback and ratings.

This system is very valuable for users wanted to improve their designs by getting constructive criticism from other experts in the field.

MOBILEDESKTOP

TABLET

Page 3: Milestone 4 pptx-- responsive prototype

Adaptive View: DesktopMain User Story

User starts at a page of other designers’ projects with a filter and a search function. He clicks on the “Review” button, and the website takes him to Project page that he can click through the clickable prototype. User is allowed to rate and review on the same page where they click through the prototype. He rates and adds his comments, and then clicks the “Submit” button. His comment then shows up at the top of the comment list, and a note that indicated that his comment has been added.

Device Constraints: Device Name: Desktop MonitorViewport Size: 1024 (Width) or greaterInput Type: Click

Page 4: Milestone 4 pptx-- responsive prototype

Adaptive View: Desktop (cont.)Context of Use

How will users physically interact with your app?User will mainly use a mouse and a keyboard to navigate through the website on

their desktop or laptop. Users will primarily upload their own designs from their desktop/laptop. They can

also view and comment on other designers’ projects, since the website allows users to easily navigate through all the available features.

Where will they be?Users would mostly be at work, at home, or at coffee shops using their

desktops and/or laptops when they have time to browse through projects and upload their own.

Page 5: Milestone 4 pptx-- responsive prototype

Adaptive View: TabletMain User Story

User starts a page of other designers’ projects using only a search function. He clicks on the “Review” button, and is taken to the Project page so that he can interact with the clickable prototype; there are no preview images in this view. He rates and adds his comments, and then clicks the “Submit” button, on the right hand side. His comment then shows up at the top of the comment list, and a note that indicated that his comment has been added.

Device Constraints: Device Name: TabletViewport Size: 800-1023 pixels (Width)Input Type: Touch

Page 6: Milestone 4 pptx-- responsive prototype

Adaptive View: Tablet (cont.)Context of Use

How will users physically interact with your app?Users will use their thumbs or fingers on their tablet to navigate through the app.

User can view and edit comments easily, but still has the option to upload

their own projects from the tablet view. As a reviewer, using a tablet will provide the similar functionality to a desktop,

but less features as there would be no built-in filter function, still preview images of prototype, etc, since the screen size is smaller than a desktop.

Where will they be?The tablet is much more portable than a desktop or laptop, and give them the

ability to use it wherever they please. This adaptive view will be used in a library, train, school, work, home, restaurants and shop, etc.

Page 7: Milestone 4 pptx-- responsive prototype

Adaptive View: MobileMain User Story

User starts with a page with a list of other designers’ projects. He is browsing the project list, and then he presses on one that looked interesting to him. The user explores and interacts with the clickable prototype, and decides to give some comments for the designer. He presses the “Review” button, and the app then takes him to the review page. After the user rates the project and enters his name and comment, he presses the “Submit” button. The app then takes him to the final page with all other reviewers’ comments on that particular project.

Device Constraints: Device Name: iPhone 6Viewport Size: 375 pixels (Width)Input Type: Touch

Page 8: Milestone 4 pptx-- responsive prototype

Adaptive View: Mobile (cont.)Context of Use

How will users physically interact with your app?User will mainly use their thumbs and/or fingers to navigate through the web app

on their mobile phones. Most likely the users will view and comment on other designers’ projects, rather

than uploading their own designs on a mobile phone, even though they’d still have the capability to do that if they wanted to.

Where will they be?Users would mostly be on-the-go during commute, waiting in line, or somewhere

outdoors.

Page 9: Milestone 4 pptx-- responsive prototype

Responsive Prototype

AxShare Link:http://xtkqcj.axshare.com/#c=2