Sales Funnel Application

COMM 394 – Coding Literacy for Managers

TEAM Assignment

Weight 30%

Description

For this assignment, your team has been hired by a small business to develop a Sales Funnel application specific to their business. The business wants to gain insights into its sales opportunities to predict

revenue on a quarter-by-quarter basis. The application has two distinct users: Sales Reps and Sales Managers.

You are required to develop the application using JavaScript, HTML and CSS, along with writing the user instructions. The application lists Minimal Functional and Non-Functional Requirements that must be

implemented, but you have creative licensing on how you choose to meet or exceed those

requirements. You will also be required to identify additional requirements specific to your chosen business.

For example, one requirement is to handle input errors, which can be done in various ways.

.    Accept the error

.     Provide instructions

.     Use a drop-down list

.     Use built-in error functions

Note: The elegance of how the requirement is implemented will impact your final grade.

Deliverables

You are responsible for creating and submitting the following deliverables. It is recommended that you complete the documentation in the order presented.

. Company Context (Word)

o One Page

. Computational Thinking Solution (Word)

o Three to five pages (it will vary depending on how you choose to represent the information)

. Figma Wireframe (Link to you Figma)

o One Figma project with a wireframe for each web page.

. Application (Zip file)

o One JavaScript file, one CSS file and one or more HTML files

. User Documentation (Word)

o Three to five pages (it will vary depending on how you choose to represent the information)

. Requirements Self Evaluation (Separate Assignment on the Course Portal)

o FeedbackFruits Survey

. References (Word)

o One or more pages

Note: One Word document and one Zip file must be submitted to the assignment dropbox.

Company Context

In this section, you will briefly describe the situation in which you are building that application.

Computational Thinking Solution

You will develop a solution using computational thinking, and once it is complete, you will use the solution to build your application.

In this assignment, we will only focus on the following steps of Computational Thinking.

.     Problem Identification

.     Decomposition

.     Pattern Recognition

.    Abstraction

We will leverage Data Representation and Algorithms in our subsequent assignments.

Based on the requirements of the application, develop the following:

Problem Identification

Based on the company context you developed, create the initial problem statement using the Computational Thinking class's Who, What, Where, When and Why framework.

.    Write a problem statement in paragraph format.

.    After the paragraph, write the details of Who, What, Where, When and Why.

Decomposition

Decompose the problem statement into sub-problems and create a problem statement for each.

.    Write a paragraph explaining how you broke the problem into sub-problems and why.

.    Write a problem statement for each sub-problem.

.    Write the details of Who, What, Where, When and Why for each sub-problem statement.

Pattern Recognition

The process of pattern recognition is to list the steps required to solve each problem. Each step must    have enough detail to identify what needs to be done but generic enough to recognize patterns across the multiple lists. The goal of pattern recognition is to identify steps common for some or all the sub-   problems and ones that are unique. Once Common or Semi-Common patterns have been identified,

develop a JavaScript function to perform the steps.

.     Document the high-level steps required to complete each sub-problem using bullet points.

.     Identify common steps amongst one or more subproblems and ones unique in table format.

.     For each set of common steps, you will create a function that can be called to perform these steps across multiple problems. In the computational thinking part of the assignment, describe

Example: In Excel, data is represented in table format, and how it is structured (columns); the format of each cell (text, number, date) is how it is stored.

For each constructor, you will need to describe how the object will be broken down into attributes and what methods will be needed.

Document the constructors in the following manner.

Figma Wireframe

The final part of this section is to provide a visual representation of the solution you will build. Using Figma you will develop a wireframe that visually represents the following:

.     Inputs, images and outputs for each web page

.     Font, colour and layout

Include the URL to the Figma design in the Computational Thinking section and a brief description of its purpose.

To share a Figma project, click on share at the top left of the project and change the permission to anyone with the link can view the project.

Functional Requirements

SALES MANAGER

.    The application must allow the Sales Manager to create Sales Reps with the following details (MINIMUM)

o Name

o Phone Number

o Region

o User Name

o Password

.    The application must allow the Sales Manager to delete a Sales Rep

.    The application must allow the Sales Manager to set the commission formula for all Sales Reps

.    The application must allow the Sales Manager to reassign deals from one Sales Rep to another

.    The application must allow the Sales Manager to view and change existing deals

.    The application must allow the Sales Manager to delete existing deals

.    The application must allow the Sales Manager to see total sales for the end of the quarter, along with the total commission payout for all Sales Reps

.    The application must allow the Sales Manager to see the sales funnel for all Sales Reps

.    The application must allow the Sales Manager to see total sales for the end of the quarter, along with the total commission payout for a specific Sales Rep

.    The application must allow the Sales Manager to see the sales funnel for a specific Sales Rep

SALES REPS

.    The application must allow a Sales Rep to log into the application using a unique username and password assigned by the Sales Manager

.    The application must allow Sales Reps to enter each of their deals with the following details (MINIMUM)

o Name of Business

o Contact information (address, phone,... -- might be 2-3 contacts/titles in the business)

o Forecasted Deal size ($)

o Expected Close Date

o Current stage of opportunity, along with the confidence level of the stage

. Awareness

. Interest

. Consideration

. Intent

. Evaluation

. Purchase

. Closed Lost

.     Reason for loss

.    The application must allow the Sales Rep to view and change existing deals

.    The application must allow the Sales Rep to delete existing deals

.    The application must allow the Sales Rep to see their total sales for the end of the quarter, along with their total commission payout

.    The application must allow the Sales Rep to see their sales funnel

.    The application must calculate the total sales for the end of the quarter along with the total payout of commission for the Sales Rep

Non-Functional Requirements

4.0 - Usability

.    4.1 - The application must be intuitive and easy to use for both novice and experienced users.

5.0 - Visual Design

.    5.1 - Text and graphical elements must be clear, legible, and aesthetically pleasing.

6.0 - Consistency

.    6.1 - The application must maintain consistency in elements (buttons, icons, fonts) and interactions throughout the application.

.     6.2 - Consistent naming conventions and labelling must be used to reduce user confusion

7.0 - Error Handling

.    7.1 - The application must provide clear and user-friendly error messages that help users understand and recover from errors gracefully.

.    7.2 - Validation errors must be highlighted near the point of input.

User Documentation

In this section, you will describe the sales funnel process and how to set up the application. You will then provide a set of step-by-step instructions that will be used to complete each of the following steps.

Sales Manager

.    Add a sales rep

.    Setup the commission formula

Sales Reps

.     How to add a deal

.     How to change a deal

.     How to delete a deal

.     How to view their sales funnel

.     How to view the total sales and commission for the quarter

Sales Manager

.     How to reassign a deal

.     For each sales rep

o How to add a deal

o How to change a deal

o How to delete a deal

o How to view their sales funnel

o How to view the total sales and commission for the quarter

.     How to view a consolidated view of all the sales funnels

.     How to view a consolidated view of all sales and commissions for the quarter

Assignment Self Evaluation

Self-evaluation of an assignment is a crucial process that empowers you to assess your work objectively and critically. It involves stepping back and reviewing your ability to meet the assignment's functional

and non-functional requirements. On a requirement-by-requirement basis, you will assess your ability to

meet the requirement, the quality of your solution and areas for improvement. This practice is

immensely beneficial as it fosters self-awareness, helping you understand your strengths and

weaknesses in programming. It promotes a proactive approach to learning as you gain insights into where to focus your efforts to enhance your skills. Self-evaluation also encourages accountability,

allowing you to take ownership of your learning journey, ultimately leading to more effective problem-

solving and a deeper understanding of programming concepts – skills invaluable in business and technology.

Complete the self-assessment for each requirement by identifying the following:

References

You are expected and encouraged to use various sources of information to complete your assignment. Included but not limited to:

.    Solutions and examples used in class

.    W3Schools or similar JavaScript, HTML or CSS resource websites

o If the code was taken from an existing source, include the link to the website for each requirement implemented using the code.

.    Generative AI tools

o If the function(s) was generated from a Generative AI, you must include the prompt and the AI response.

Grading

37.5% Based on Computational Thinking

37.5% of your final grade for this assignment will be based on your ability to develop the solution using Computational Thinking.

37.5% User Documentation

37.5% of your final grade for this assignment will be based on your ability to develop an application

based on your Computational Thinking solution. This will be assessed by performing a User Acceptance Testing script that we have developed to test each requirement. Using our script, we will follow your instructions to assess each requirement.

25% Based on Self-Assessment

25% of your final grade for this assignment will be based on the self-evaluation assignment you

complete on the course portal in the assignments section. The self-evaluation lets you reflect objectively on your work and determine how your submission meets the assignment requirements.