Milestone 3: Design Alternatives

Due Date

WED 2020-11-04 @ 11:55 PM EDT via Piazza.

Introduction

In this milestone, you will develop interface designs for your proposed solution in the form of wireframes and mockups. You should provide pencil-and-paper or electronic images of the interface at various stages; you should not be building a functional system or prototype.

Objective

In this milestone, you will use the knowledge that you gained from Milestone 2, DDQs, and the required readings to develop a set of design alternatives for your problem of study. These multiple design alternatives should explore the potential design space for the problem.

Dissemination

This milestones will include a deliverable report. Thes report should be in PDF or HTML format and be publicly-accessible via your team’s public home page. The specific format of thes deliverable report is up to your team, but it should appear professionally-prepared.

Instructions

  1. Prepare the following deliverables for this milestone, all of which should be included in the deliverable report you create and link to via “Milestone 3” under “Milestone Links” on your group’s public home page.

    Warning

    Even if you are not explicitly asked, you must provide supporting evidence for any claims you make in your deliverable report. This information should come from a variety of different venues, such as academic conferences, news reports, interviews, questionnaires, etc. Make sure you use proper, consistent citations in your reports and justify any unusual sources.

    A. User Experience Requirements

    1. Decompose your proposed solution from Milestone 2 into related user stories. It is highly recommended that you organize your user stories into a hieararchy based on related activities and tasks.

    2. Which user stories are most relevant to your proposed solution and why? It could be all of them or perhap only a few. Whatever you pick, please provide a strong justifiction with supporting evidence.

    B. Ideation and Prelimniary Designs

    1. For each of the relevant user stories you identified and justified in (A), generate ideas for alternative designs that could be used to tell that story.

    2. For each alternative design of a user story, produce a wireframe with enough artboards (i.e., pages, screens, etc.) that a potential user might be able to provide useful feedback. Each wireframe should:

      • be presented in way that viewers can see all artboards at once and individually (perhaps by clicking); and

      • include a justification for why design decisions were made.

      If you use pencil and paper, then you must provide nice, cropped scans of your designs with consistent cropping dimensions. If you use software (e.g., Adobe XD), then you must provide a download link for the source file in addition to one or more exported PNG files.

    Warning

    Part (B) is about the design process, and it’s important that you work together. That is, do NOT do the following: split up the work such that everyone creates their own set of designs, then collect these designs and present them as your alternatives. That is not how a good, creative design process should work. It should be more like a brainstorming session with all team members present. You should seek to create some fundamentally different design ideas for your solution.

    C. Detailed Designs

    1. For each of the relevant user stories you identified and justified in (A), pick what you think is the best design alternative you wireframed in (B), then produce a higher fidelity mockup of the wireframe. Each mockup should:

      • be presented in a manner consistent with your wireframes in (B);

      • include a justification for why you think its the best design; and

      • include a justification for why design decisions were made.

      You are expected to use use a software tool (e.g., Adobe XD) to create your mockups. For each mockup, you must provide a download link for the source file in addition to one or more exported PNG files.

    Warning

    When creating a mockup in (C), you will inevitably make more design decisions than you did for the wireframe. Your justification for why design decision were made, therefore, should not simply be a repeat of what you wrote for the wireframe.

    D. Summary Video

    1. Create a 5-10 minute video that summarizes the information in parts (A), (B), and (C). The creation of this video should involve all team members, and the video itself should contain credits at the end describing who did what.

    You should provide the link to the video in your milestone deliverable report; if your report is an HTML page, then you may embed the video into the page in addition to providing the link.

  2. Prior to the milestone deadline, one team member needs to post the following information in in a followup discussion to this Piazza post.

    1. Team Name

    2. Team Member Names

    3. Brief Synopsis – shorter than what’s on your home page

    4. Link to your group home page

    5. A few sentences describing what you thought was easy/hard about this paricular milestone

Grading

Item

Points

Assessment

Updated Public Home Page

20%

Pass / Fail

User Experience Requirements

20%

Rubric

Ideation and Prelimniary Designs

20%

Rubric

Detailed Designs

20%

Rubric

Summary Video

20%

Rubric

For this assignment, any portion that is designated as using a rubric will be graded on a 20-point scale that coincides with a rubric designed to mirror the related prompts. Be sure to address every aspect of a prompt.