Table of Contents

• Pitch
• Summary of features
• Current Architecture
• Team
  • Organization Chart
  • Roles
• Requirements
• Charts
• Architecture
• Testing Plan
• Status Reports

Pitch

Struggling to decide what to do with friends? Whether it’s picking a restaurant, movie, or activity, QuikVote makes group decisions fast and fair. Simply create a vote room, share it, and let everyone vote simultaneously. Don’t like the options? Add a new one in seconds! Once the votes are in, the results are clear, and you can get on with your plans. Make decisions effortlessly with QuikVote—the quick, easy solution to group indecision!

This was the project I did for CS260. Here's a demo. I got some initial features into it, but I had planned more.

Summary of features (crossed out ones are already implemented)

• Basic username/password auth
• Sharable rooms where multiple people can vote simultaneously
• History of results (only for rooms you create)
• Anonymous users (ie. you don't have to sign-in to use it)
• Ability to see who has/has not voted
• More details on results (eg. how close the scores were, who voted what)
• Make rooms more sharable (eg. links, pre-formatted messages, etc)
• Ability to easily rejoin rooms after disconnect
• Room admin options:
  • Additional voting/counting methods (eg. rank voting, approval voting, etc)
  • Optional time limit
  • Ability to kick users
  • Automatically kick users after period of inactivity
  • etc

Current Architecture

Frontend

• React, javascript
• Vanilla CSS

Backend

• Node, javascript
• MongoDB
• AWS, EC2

Team

• Connor Ellis
• Josh Hendershot
• Austin Hillyard
• Clara Li
• Matthew Nelson
• Garett Whimple

Organization Chart

Role Responsibilities

Role	Description
Project Manager	Responsible to writing and uploading the week status report. Facilitates task responsibilities and cooperation between developers. Helps manage project schedule. Assists where needed in development.
Chief Architect	Makes executive decisions on application architecture and technologies. Helps provide interfaces between components and modules.
Front React Developer	Develops frontend code, especially client-facing elements
Database Developer	Creates an interface for the database for the backend. Manages database implementation and functionality.
Backend Developer	Responsible for the backend development of the application, including implementing API routes for all frontend needs.
AWS Tech	Manages AWS resources and configurations. Responsible for ensuring uptime, security, and scalability from said resources.
Pipeline Developer	Setting up a CI/CD pipeline with GitHub actions that deploy the website continually. Also implementing a linting/ type checking system
Testing Specialist	Responsible for creating testing infrastructure as well as the actual tests for both the front the front end and back end

Requirements

Overview

For Quikvote, we have identified several features that are more quality of life and improve the user's interaction with the app. Those tasks will be prioritized for the early demos, and later on if time and technology allows, we will focus on adding additional functionality in different types of voting logic and methods.

Prototype Demo (3/10)

• Anonymous Voting: Allows users to join a room without logging in. Maybe keep the login requirement for moderators though.
  • Nicknames: Allow/Require anonymous users to enter a nickname so that their name can show up for future result formats.
• Shareable Link / QR Code: To make it easier for users to join, have a shareable link and/or a QR code that can be displayed once in the room.
  • The ability to click a button while in the room, that pulls up a QR image popup, as well as a URL link with a copy or share button you can click.
• Clearer and more Specific Results: Currently Quikvote only displays the ordering of the results, we would like more detail on the results such as the number of votes for each option as a default, and potentially who voted for what.
• Ability to unlock vote: Users can unlock their vote selection after locking in.
• Back-end in TypeScript: The back-end is to be refactored into TypeScript to improve coherency between different back end developers.

Work in Progress Demo (3/24)

• Moderator Options Architecture: An architecture that allows the moderator/host to choose specific options for the voting room. These can affect both the voting method and options therein, as well as how the results are displayed.
  • Results Options: Options that limit and expand what information
    • Number of runner ups: Choose how many runner up options to display on the result screen, default would be all.
    • Show number of votes: Choose whether to show how many votes each option received
    • Show who voted for what: Choose whether to show what users voted for what via their nickname. (If this option is turned on, entering a nickname would be mandatory)
  • Voting Options: Options that determine how the vote is carried out and decided. At this point, only Score Voting is implemented.
    • Number of votes allotted: Change how many votes each user gets

Final Product Demo (4/14)

• More Voting Options: More complex voting options available for users
  • Approval Voting: Users can vote once for as many or as few options as they like.
  • Rank Voting: Users rank their selections, which are assigned a score value used to calculate results.
  • Options Round: Add a pre vote round where users can submit options before voting begins. Can specify a limit.
  • Timer: Add a timer functionality that limits the amount of time users have to vote before automatically locking in.
  • Vote for User: Specify an option where everyone can vote for one of the users present in the room.

Charts

PERT Chart

• Critical Path: 32 days

GANT Chart

Architecture

Write Up

Purpose

Quikvote is a quick and easy way to get you and your group to vote together on whatever suits your fancy. It is a web hosted app where you can create a room, get a shareable code, QR code, or URL to give to your friends and family, and the all join together in a room to vote with a variety of options. You don't need an account if you don't care about keeping your result history, so you can instantly join the vote hassle free. Some of the options include the number of votes you get, approval voting, rank voting, or an options pre-round where you submit options before the vote begins. You can also change how the results are displayed as well, being as specific as to show who voted for what options, and as limited as only showing the winning result.

Design

This app is split into a frontend and backend architecture. The frontend is developed in React and JavaScript, calling several APIs to login, create a room, and publish and retrieve results. The frontend also uses WebSocket technology to communicate with other clients in the same room to share new voting options in real time.

The backend is hosted on a AWS EC2 instance in TypeScript, which handles all of the API endpoints that the frontend calls. it also reads and writes to a mongoDB database, which stores user info, voting session results, and room ids and their respective URLs. The models for the voting options are also stored on the backend, but the front end will handle the functionality given the model.

Workflow

A user can start by registering/logging in to quikvote, and from their create a room. The room generates a four digit code which has an associated QR code and URL that can be shared to other users allowing them to join the same room. The host can set some moderator options for the vote, and then begin. Other users options will be added to the vote as they are created, and users can distribute their votes. Once you are down voting, you can lock in your vote, and once all users are locked in, or the host ends the voting round, the results are tabulated and displayed to the user on the results screen. All results are also stored in each user's history which can be found on the main menu.

Testing Plan

Testing and QA Plan

Status Reports

Week #	File
1	Feb 3 - Feb 8
2	Feb 9 - Feb 15
3	Feb 16 - Feb 22
4	Feb 23 - Mar 1
5	Mar 2 - Mar 8
6	Mar 9 - Mar 15
7	Mar 16 - Mar 22
8	Mar 23 - Mar 29
9	Mar 30 - Apr 5
10	Apr 6 - Apr 12