CSE 270 | Learning Activities

Teton Idaho Chamber of Commerce Web Site

Requirements Document version 1.1

Introduction

Teton City Chamber of Commerce has contracted with our company to develop a new web site for their organization. This website will help disseminate information about the chamber, allow people to sign up for the chamber and gain valuable information about the area.

Product Scope

The website will consist of the following pages:

Home Page: At a glance information about the area, how to join, sponsored organizations, current events, news and weather.
Discover Page: A gallery of pictures that shows some of the local attractions, history and demographics of the area.
Join Page: A form for the users to sign up for the chamber as well as information about the benefits of joining along with pricing information.
Directory Page: A directory of information about current members of the chamber of commerce, their business and services they provide.

User Profiles

Business Owners:
- Business owners who want to learn about local business resources, networking events, and advocacy opportunities.
- Users may be interested in advertising and sponsorship opportunities, as well as opportunities to connect with other local business owners.

Prospective Business Owners:
- Entrepreneurs who are considering starting a business in the area and are looking for information on the local economy, available commercial real estate, and regulatory requirements.
- They may also be interested in resources for starting a business, such as financing options and business planning assistance.

Community Members:
- Residents who want to stay informed about local events and initiatives, including community outreach programs and charitable activities sponsored by the chamber of commerce.

Tourists:
- Visitors to the area who are looking for information on local attractions, accommodations, restaurants, and other amenities.
- They may also be interested in guided tours or other activities organized by the chamber of commerce.

Government Officials:
- Elected officials and government staff who want to stay informed about local economic development initiatives and other business-related issues in the community.
- They may also use the chamber of commerce website to connect with local business leaders and other community stakeholders.

Functional Requirements

Common Website Requirements
1. As a website visitor, I want to see clearly the name and logo on all pages so that I know I am visiting the Teton Chamber of Commerce website.
  1. Given the visitor is browsing any page of the site
    when the visitor views the site header,
    then the Teton Idaho Chamber of Commerce logo is clearly visible
    and the website name “Teton Idaho Chamber of Commerce” is clearly visible
    and the website name “Teton Idaho CoC” appears in the browser tab.
2. As a website visitor, I want to be able to navigate to the home page, join page or directory page on all pages with ease so I can find the information I am seeking.
  1. Given the visitor is browsing any page of the site,
    when the visitor views the site header in the screen view
    then the link to the home page is clearly visible,
    and the link to the join page is clearly visible
    and the link to the directory page is clearly visible.
  2. Given the visitor is browsing any page of the site,
    when the visitor views the site header in the phone view
    and the visitor clicks the “hamburger menu” to make the menu visible
    then the link to the home page is clearly visible,
    and the link to the join page is clearly visible
    and the link to the directory page is clearly visible.
3. As a website visitor, I want to quickly and easily visit the social media sites for the Teton Idaho Chamber of Commerce from all pages so that I can follow them on social media.
  1. Given the visitor is browsing any page of the site,
    when the visitor views the site header,
    then a link to the Teton Idaho CoC Pinterest Page is clearly visible,
    and a link to the Teton Idaho CoC Instagram Page is clearly visible.
4. As a website visitor, I want to see today’s date prominently displayed on all pages so I can know today’s date without effort.
  1. Given the visitor is browsing any page of the site,
    when the visitor views the site header,
    then today’s date will be prominently displayed directly below the header.
5. As a website visitor, I want to see a map of the chamber of commerce offices on all pages so that I can quickly and easily navigate to the office when I am ready to visit.
  1. Given the visitor is browsing any page of the site,
    when the visitor views the site footer,
    then an icon representing a Google map will be clearly visible
    and clicking the Google map icon will open the map in a new browser tab.
6. As a website visitor, I want to see contact information for the chamber of commerce on all pages so that I can easily reach out if I have questions or need information.
  1. Given the visitor is browsing any page of the site,
    when the visitor views the site footer,
    then the e-mail address info@tetonchamber.org will be clearly visible
    and the phone number 208-458-4444 will be clearly visible.
Home Page Requirements
1. As a website visitor, I want to see a hero image prominently displayed on the home page so that my interest in the Chamber of Commerce website is raised.
  1. Given the visitor is browsing the site home page,
    when the user first visits the page without scrolling
    then a large image depicting the local area will be clearly visible in the main portion of the page below the site header.
2. As a website visitor, I want a call to action on the home page that takes me quickly to the join page so that I can sign up to be a member of the chamber of commerce.
  1. Given the visitor is browsing the site home page,
    when the user view the hero image described
    then a button labeled “Join Us” will be prominently displayed over the hero image
    and clicking the “Join Us” button will take the user to the join page
3. As a website visitor, I want to see local news on the home page so that I can be aware of current events in the area.
  1. Given the visitor is browsing the site home page,
    when the user views the home page
    then a section dedicated to local news will be present somewhere on the page
    and the news section will contain one news item
    and the news section will contain an image from the news item
    and the news section will contain a headline from the news item
    and the news section will contain a description of the news item
4. As a website visitor, I want to see events on the home page so that I can choose to participate in upcoming activities that interest me.
  1. Given the visitor is browsing the site home page,
    when the user views the home page
    then a section dedicated to current events will be present somewhere on the page
    and the events section will contain one current event
    and the events section will contain an image from the current event
    and the events section will contain a headline from the current event
    and the events section will contain a description of the current event
5. As a chamber of commerce member, I want to see local businesses spotlighted on the home page so that they can advertise their business and raise awareness.
  1. Given the visitor is browsing the site home page,
    when the user views the home page
    then a section spotlighting two local businesses will be displayed
    and each spotlight section will include the business name
    and each spotlight section will include an image
    and each spotlight section will include a street address
    and each spotlight section will include a business description
    and each spotlight section will include a website URL
6. As a website visitor, I want to see the local current weather conditions on the home page so I can know if this is a good time to visit the area.
  1. Given the visitor is browsing the site home page,
    when the user views the home page
    then a section displaying the weather will be visible and the current weather icon will be visible in the weather section
    and the current weather description will be visible in the weather section
    and the current temperature in Fahrenheit will be visible in the weather section
    and the current wind speed in MPH will be visible in the weather section
Join Page Requirements
1. As a potential chamber of commerce member, I want to see information about the different levels of membership on the join page so that I can know what the costs and benefits of joining the chamber at each level are.
  1. Given the visitor is browsing the site join page
    when the user views the page
    then the information for the Non-Profit level of membership will be displayed
    and the information for the Bronze level of membership will be displayed
    and the information for the Silver level of membership will be displayed
    and the information for the Gold level of membership will be displayed
2. As a potential chamber of commerce member, I want to fill out all the required information including first and last name, e-mail address, phone number, business name and chosen membership level in order to join the chamber of commerce and become a member.
  1. Given the visitor is browsing the site join page
    when the user views the page
    then a field for first name will be displayed
    and the user cannot submit the form when the first name field is empty
    and the user cannot submit the form if the field contains more than 20 characters
  2. Given the visitor is browsing the site join page
    when the user views the page
    then a field for last name will be displayed
    and the user cannot submit the form when the last name field is empty,
    and the user cannot submit the form if the field contains more than 20 characters
  3. Given the visitor is browsing the site join page
    when the user views the page
    then a field for email address will be displayed
    and the user cannot submit the form when the e-mail address field is empty
    and the user cannot submit the form if the field does not contain an entry formatted like an e-mail address
  4. Given the visitor is browsing the site join page
    when the user views the page
    then a field for phone number will be displayed
    and the user cannot submit the form when the phone number field is empty
    and the user is shown an example of the proper phone number formatting
    and the user cannot submit the form if the field is not formatted like this XXX-XXX-XXXX
  5. Given the visitor is browsing the site join page
    when the user views the page
    then a field for business name will be displayed
    and the user cannot submit the form when the business name field is empty
    and the user cannot submit the form if the field contains more than 40 characters
  6. Given the visitor is browsing the site join page
    when the user views the page
    then a selection box for membership level will be present
    and the user cannot submit the form when no membership level has been chosen.
3. As a chamber of commerce, I want to gather non-required information about the member including position title, website URL and business description so that I have additional useful information associated with their membership.
  1. Given the visitor is browsing the site join page
    when the user views the page
    then a field for position title will be displayed
    and the user does not have to fill out the position title to submit the form.
  2. Given the visitor is browsing the site join page
    when the user views the page
    then a field for website URL will be displayed
    and the user does not have to fill out the website URL to submit the form.
  3. Given the visitor is browsing the site join page
    when the user views the page
    then a field for business description will be displayed
    and the user does not have to fill out the business description to submit the form.
4. As a chamber of commerce, I want to keep track of the date the member signed up so I can know what their seniority level is for future needs.
  1. Given the visitor is browsing the site join page
    and the user has filled out the join form
    when the user submits the form
    then the date of the form submission is clearly visible in the summary page
5. As a potential chamber of commerce member, I want to see a summary of the information I submitted on the Join Page in a separate confirmation page so I can be sure I entered the right information and that it was correctly received.
  1. Given the visitor is browsing the site join page
    and the user has filled out the join form
    when the user submits the form
    then the first name of the visitor is displayed in the summary
    and the last name of the visitor is displayed in the summary
    and the e-mail of the visitor is displayed in the summary
    and the phone number of the visitor is displayed in the summary
    and the business name of the visitor is displayed in the summary
    and the chosen membership of the visitor is displayed in the summary
    and the position title of the visitor is displayed in the summary if provided
    and the website URL of the visitor is displayed in the summary if provided
    and the business description of the visitor is displayed in the summary if provided
Directory Page Requirements
1. As a website visitor, I want to see a list of businesses who are already members of the chamber of commerce including information about name, website URL and street address so that I can find relevant information about business in the area.
  1. Given the user is browsing the directory page
    when the user views the directory page
    and the user clicks on the “list” button
    then a list of members of the chamber of commerce is visible
    and the list includes the business name
    and the list includes the business street address
    and the list includes a link to the business website
  2. Given the user is browsing the directory page
    when the user views the directory page
    and the user clicks on the “list” button
    then a list of members of the chamber of commerce is visible
    and clicking the link to the member’s website will open the site in a new tab
2. As a website visitor, I want to see at-a-glance information about businesses including their logo, name, website URL, e-mail address and street address so that I have the information about them I need.
  1. Given the user is browsing the directory page
    when the user views the directory page
    and the user clicks on the “grid” button
    then a card view of members of the chamber of commerce is visible
    and each card includes the business name
    and each card includes an image for the business
    and each card includes the street address of the business
    and each card includes a link to the business website
  2. Given the user is browsing the directory page
    when the user views the directory page
    and the user clicks on the “grid” button
    then a card view of members of the chamber of commerce is visible
    and clicking the link to the member’s website will open the site in a new tab

External Interface Requirements

Weather – up to date weather information to be provided by OpenWeather. See https://openweathermap.org/current for specification.

Non-functional requirements

As a website visitor, I want the website to pass the WAVE accessibility tests with no errors found at https://wave.webaim.org > will not have difficulty viewing or reading information on the site.
As a website visitor, I want the website layout to change appropriately for phone, tables and screen devices so that I can view the website accurately on whatever device I choose.
As a website visitor, I want the website to display a meaningful page title at the top of the browser so that I can return to the page on my browser quickly and easily if multiple tabs are open.
As the chamber of commerce, I want the page meta description to be populated appropriately so that when search engines crawl my page they can use the description of my choosing in their search results.
As a website visitor, I want the website to be free of obvious violations of design principles such as contrast, repetition, alignment and proximity so I can enjoy an ideal viewing experience on the site.
As a chamber of commerce, I want the website to be free of console errors and logging so that my site looks professional and has no unexpected problems or data leakages.
As a website visitor, I wasn’t the website to load in under 3 seconds even when under a load of 10 requests per second so that I don’t get frustrated and leave.
As the chamber of commerce, I want the website to score a 90 or better in the Google Lighthouse test in order to assure the best experience for website users.
As the chamber of commerce, I want the website to load with less than 500KB of assets to reduce my outlays for metered Internet connections.
As the chamber of commerce, I want all interactions with the web site to be over HTTPS in order to ensure security of data over the network.
As the chamber of commerce, I want the website to be up 99.9% of the time.
As the chamber of commerce, I want the website to respond with an average response time of less than 2 seconds under average load.
As the chamber of commerce, I want the website to respond with an average response time of less than 3 seconds under peak load (100 simultaneous users).

Useful Links:

Return to: Week Overview | Course Home | Canvas