Skip to content

Latest commit

 

History

History
233 lines (201 loc) · 11.4 KB

README.md

File metadata and controls

233 lines (201 loc) · 11.4 KB

CS 147 High-Fidelity Prototype

App Name

QuokkaTips

Table of Contents

  1. Video Demo
  2. Overview
  3. Product Spec
  4. Wireframes
  5. Schema

Video Demo

Watch the video

Overview

Description

QuokkaTips is an AR application designed for teachers that superimposes tutorials of classroom software over the user’s field of vision. The app revolves around empathy, as a cute quokka guides the user in real-time learning, discovering, and staying up to date with a set of trending classroom software.

App Evaluation

  • Category: Utilities
  • Platform: Mobile-first experience, utilizes camera view, best used on a smartphone or tablet, iOS or Android
  • Market: Teachers who need assistance with using classroom software
  • Scope: V1 allows the user explore classroom software related to their interests/subjects, learn specific features of classroom software (through AR, videos, or text with images), and stay up-to-date with new features of classroom software. V2 can include a social network, where users can follow each other and build their profiles.
  • Habit: Users can form a habit to check this app (summon Quokka) whenever they encounter technical issues with classroom software for real-time troubleshooting, rather than calling the school's IT. The explore feature of this app can also direct the user in planning lessons and learning from other teachers.

Product Spec

1. User Stories (Required and Optional)

Required must-have stories

  • User can create a new account, login, and logout
  • User can navigate between 3 tabs
  • User can view a list of saved guides ("My Guides" tab)
  • User can explore a list of unsaved apps ("Explore" tab)
  • User can ask Quokka for help in their camera view ("Ask Quokka" tab)
  • User can click an app to view its details
  • User can navigate between the "Info" and "Features" tabs of an app
  • User can add an app to their saved guides
  • User can remove an app from their saved guides
  • User can see a list of features of an app
  • User can click a feature to view its details
  • User can view a camera tutorial of a feature
  • User can view a video demo of a feature
  • User can view text/image instructions of a feature
  • User can identify and review new features
  • User can pin/unpin a feature
  • User can see their chat history with Quokka
  • User can explore apps with categorization
  • User can click "View All" to expand a category
  • User can use a search bar to filter saved guides, unsaved apps, or features of an app
  • User can click a review to see its details
  • User can view a QuokkaTips walkthrough
  • User can view the about page of QuokkaTips

Optional stories

  • User can write a review for an app
  • User can edit their account info
  • User can sort guides in different orders
  • User can sort features in different orders

2. Screen Archetypes

  • Login Screen
    • User can login
  • Signup Screen
    • User can create a new account
  • Saved Guides Screen (Tab)
    • User can view a list of saved guides
    • User can user a search bar to filter saved guides
    • User can click an app to view its details
    • (User can sort their guides in different orders)
  • Explore Screen (Tab)
    • User can explore a list of unsaved apps
    • User can explore apps with categorization
    • User can click "View All" to expand a category
    • User can use a search bar to filter unsaved apps
  • Help Screen (Tab)
    • User can see Quokka and their camera view
    • User can chat with Quokka
  • Chat History Screen
    • User can see their chat history with Quokka
  • App Detail Screen
    • User can navigate between the "Info" and "Features" tab of an app
    • User can add an app to their saved guides
    • User can remove an app from their saved guides
    • User can see a list of features of an app
    • User can click a feature to view its details
    • User can use a search bar to filter features of an app
    • User can identify and review new features
    • User can click a review to see its details
    • (User can sort features in different orders)
    • (User can write a review for an app)
  • Feature Detail Screen
    • User can view a video demo of a feature
    • User can view a camera tutorial of a feature
    • User can view text/image instructions of a feature
    • User can pin/unpin a feature
  • Drawer
    • User can view a QuokkaTips walkthrough
    • User can view the about page of QuokkaTips
    • User can logout
    • (User can edit their account info)

3. Navigation

Screen-to-screen Navigation

  • Login Screen => Saved Guides Screen
  • Signup Screen => Saved Guides Screen
  • Saved Guides Screen => App Detail Screen
  • Explore Screen => App Detail Screen
  • Help Screen => Chat History Screen
  • Chat History Screen => None
  • App Detail Screen => Feature Detail Screen
  • Feature Detail Screen => None
  • Drawer => None

Wireframes

Digital

Interactive Prototype

https://www.figma.com/proto/9pOVphglbGSdI2kzPdryGK/Med-Fi-Prototype?node-id=21%3A691&scaling=scale-down&page-id=5%3A8&starting-point-node-id=9%3A727

Schema

Models

Guide

Property Type Description
id Integer Unique id for a classroom software
name String The name of the classroom software
slogan String The slogan of the classroom software
description String Short description of the classroom software
rating Double Rating (out of 5) of the classroom software
ratingEngagement Double Rating of student engagement (out of 5)
ratingEase Double Rating of ease of use (out of 5)
logo String URL of the logo of the classroom software
numRatings Integer Number of ratings
numRatingsEngagement Integer Number of ratings
numRatingsEase Integer Number of ratings
tags String[] tags of the classroom software
screenshots String[] URLs of screenshots of the classroom software
reviews Review[] Reviews of the classroom software
features Feature[] Features of the classroom software

User

Property Type Description
id String Unique id for the user
email String Email of the user
name String Name of the user
password String Password of the user (protected)
subjects String[] Subjects that the user teaches
gradeLevels String[] Grade levels that the user teaches
guides String[] List of guideIds that the user uses
picture String URL of the profile picture of the user
pinned Map<String, String[]> Map of guideId -> list of featureIds
unread Map<String, String[]> Map of guideId -> list of featureIds

Feature

Property Type Description
id Integer Unique id for the feature
name String The name of the feature
description String Short description of the feature
updates String Newest updates of the feature
guide Integer The guideId of the guide that the feature belongs to
videoId String Video ID of the Youtube video (e.g., C4sptqFb0Bk)
instructions String[] Text tutorial of the feature (image URL or text)

Review

Property Type Description
id Integer Unique id for the review
createdAt Date Date at which the review was created
title String Short title for the review
user String The userId of the user who wrote the review
guide Integer The guideId of the guide that the review is about
rating Double Overall rating (out of 5)
ratingEngagement Double Rating of student engagement (out of 5)
ratingEase Double Rating of ease of use (out of 5)
usage String How the user uses the app
myTake String The user's take on the app

Networking

Reference

CRUD HTTP Verb Example
Create POST Creating a new post
Read GET Fetching posts for a user's feed
Update PUT Changing a user's profile image
Delete DELETE Deleting a comment

Network Requests by Screen

Saved Guides Screen

  • Read/GET: Query all the user's saved guides

Explore Screen

  • Read/GET: Query all classroom software

Help Screen

  • Read/GET: Query the Quokka AR tutorial
  • Create/POST: Add to the user's chat history with Quokka

Chat History Screen

  • Read/GET: Query the user's chat history with Quokka

App Detail Screen

  • Read/GET: Query basic info, reviews, and features of an app
  • Create/POST: User writes an review for the app
  • Create/POST: Add an app to the user's saved guides
  • Delete/DELETE: Remove an app from the user's saved guides

Feature Detail Screen

  • Read/GET: Query basic info of a feature
  • Read/GET: Query the Quokka AR tutorial
  • Update/PUT: Mark the feature as read or unread
  • Update/PUT: Mark the feature as pinned or unpinned