Da Club
Overview
The problem: UH Manoa has over 200 Registered Independent Organizations, plus many more that do not have this “official” status but are nonetheless active organizations. Unfortunately, there is no easy way for students to learn (a) what student clubs (both registered and unregistered) exist, what they do, and how to get further involved. The solution: The Club Hub application will provide a centralized directory for UH Manoa student clubs. UH Manoa students can login to browse a well organized directory of all current student clubs, with brief descriptions, meeting times and locations, URLs to their websites (if any), contact information for officers, and a few select photos.
Approach
Club Hub will have the following roles, requiring a UH ID to register:
- Regular users will be able to browse the directory or create clubs and become club owners.
- Super Admins will ensure site content is appropriate and have higher privileges than club owners.
In addition, users will not only be able to view the directory of clubs but also filter the directory to find clubs associated with different areas of interest. For example, “athletic” clubs, “art” clubs, “music” clubs, etc. A club can belong to multiple areas of interest. Some possible mockup pages include:
Sign up Page
An Sign up form to create an account.
Sign in Page
An sign page form to sign in.
Landing Page
An Landing page after you have signed in.
Add Club
An add form to add a club as a club admin. Filling out the respective prompts.
List Club
A page that lists all of the clubs in a compact manner.
User Guide
This guide will help users understand how to navigate and use the Club Hub application effectively.
Getting Started
- Visit the App: Access the Club Hub application by visiting the deployed site on Vercel.
- Create an Account:
- Click on the Sign Up button on the homepage.
- Fill out the required information (e.g., name, email, UH ID, and password).
- Submit the form to create your account.
- Log In:
- Once registered, go to the Sign In page.
- Enter your email and password to access your profile and Club Hub’s features.
Using the Features
Browsing Clubs:
- Navigate to List Clubs to see a list of clubs available at UH Manoa.
- Use the Search Bar to find clubs by name or interest area (e.g., “athletics,” “art,” or “music”).
- Click on any club to view detailed information, including meeting times, contact info, and more.
Adding a Club:
- Once logged in, go to the Add Club page.
- Fill in the form with club details such as name, description, meeting times, locations, interest areas, and gallery photos.
- Submit the form to add the club to the directory.
- Note: Only registered users can add clubs.
Editing Club Information:
- Club owners can edit their club details by navigating to the club list and clicking the Edit Club button.
- Update any fields as necessary and save changes.
Copy Club Contact Info:
- Use the Copy to Clipboard button to quickly copy the contact email for club administrators. This streamlines communication for potential members.
Managing Your Profile
- Go to the User Profile page to view and manage your account details.
- Use the Edit Profile option to update personal information, such as your name, email, or password.
FAQs
Q: What do I need to register?
A: You need a valid UH ID, email address, and a password to create an account.
Q: How do I contact a club?
A: Each club page displays contact information, including the club administrator’s email.
Q: Who can add or edit clubs?
A: Only registered users can add clubs, while club owners and admins can edit club details.
Developer Guide
Here are the directions to accessing our app:
Go to our Project Repo. Click on the Code button to and you can either open with GitHub Desktop or download a zip file.
Once you have it in you computer, go to your terminal and input the commands:
npm install
Once the packages are installed in the repo, run the following command to seed:
npx prisma migrate dev
Then finally type this command into the terminal:
npm run dev
This should take you to a http://localhost:3000 which will openup the app in your brower.
Milestone 1
Landing Page
Sign In Page
Sign Out Page
Change Password Page
Sign Up Page
Milestone 2
Landing Page
Adding a Club
Top of Add Club Form
Bottom of Add Club Form
Club List Page
Editing a Club
This page for club admins when they want to make changes to their club's information.
Managing Club Page
Top of the Edit Club Form
Bottom of the Edit Club Form
More details of the Club Page
Milestone 3
Landing Page
For Unauthenticated Users
For Authenticated Users
Sign In Page
Sign Up Page
User Profile
Users can view their profile information.
For increasing flexibility, they can also modify it.
Users also have the ability to delete their profile.
Adding a Club
Top of Add Club Form
Sign In Page
Sign Out Page
Change Password Page
Sign Up Page
Milestone 2
Landing Page
Adding a Club
Top of Add Club Form
Bottom of Add Club Form
Club List Page
Editing a Club
This page for club admins when they want to make changes to their club's information.
Managing Club Page
Top of the Edit Club Form
Bottom of the Edit Club Form
More details of the Club Page
Milestone 3
Landing Page
For Unauthenticated Users
For Authenticated Users
Sign In Page
Sign Up Page
User Profile
Users can view their profile information.
For increasing flexibility, they can also modify it.
Users also have the ability to delete their profile.
Adding a Club
Top of Add Club Form
Sign Out Page
Change Password Page
Sign Up Page
Milestone 2
Landing Page
Adding a Club
Top of Add Club Form
Bottom of Add Club Form
Club List Page
Editing a Club
This page for club admins when they want to make changes to their club's information.
Managing Club Page
Top of the Edit Club Form
Bottom of the Edit Club Form
More details of the Club Page
Milestone 3
Landing Page
For Unauthenticated Users
For Authenticated Users
Sign In Page
Sign Up Page
User Profile
Users can view their profile information.
For increasing flexibility, they can also modify it.
Users also have the ability to delete their profile.
Adding a Club
Top of Add Club Form
Change Password Page
Sign Up Page
Milestone 2
Landing Page
Adding a Club
Top of Add Club Form
Bottom of Add Club Form
Club List Page
Editing a Club
This page for club admins when they want to make changes to their club's information.
Managing Club Page
Top of the Edit Club Form
Bottom of the Edit Club Form
More details of the Club Page
Milestone 3
Landing Page
For Unauthenticated Users
For Authenticated Users
Sign In Page
Sign Up Page
User Profile
Users can view their profile information.
For increasing flexibility, they can also modify it.
Users also have the ability to delete their profile.
Adding a Club
Top of Add Club Form
Sign Up Page
Milestone 2
Landing Page
Adding a Club
Top of Add Club Form
Bottom of Add Club Form
Club List Page
Editing a Club
This page for club admins when they want to make changes to their club's information.
Managing Club Page
Top of the Edit Club Form
Bottom of the Edit Club Form
More details of the Club Page
Milestone 3
Landing Page
For Unauthenticated Users
For Authenticated Users
Sign In Page
Sign Up Page
User Profile
Users can view their profile information.
For increasing flexibility, they can also modify it.
Users also have the ability to delete their profile.
Adding a Club
Top of Add Club Form
Milestone 2
Landing Page
Adding a Club
Top of Add Club Form
Bottom of Add Club Form
Club List Page
Editing a Club
This page for club admins when they want to make changes to their club's information.Managing Club Page
Top of the Edit Club Form
Bottom of the Edit Club Form
More details of the Club Page
Milestone 3
Landing Page
For Unauthenticated Users
For Authenticated Users
Sign In Page
Sign Up Page
User Profile
Users can view their profile information.
For increasing flexibility, they can also modify it.
Users also have the ability to delete their profile.
Adding a Club
Top of Add Club Form
Site Admins or Club Owners can add clubs with a diverse set of parameters to allow for club expressiveness.
Bottom of Add Club Form
Editing a Club
Site Admins or Club Owners can Edit clubs.
Then the user can modify pre-filled fields:
Club List
Search
All site users can utilize the semantic search functionality and search for clubs based on name or interest areas. For example:
Copy to Clipboard!
For streamlining access to information. Users can copy club admin emails with a button.
View Club Information
The club table was seeded with actual RIO data from the approved UH Manoa RIO Excel sheet. Note that some information was randomly generated, e.g., room number, since the source data did not provide such information.
Review Form
Here is the form to review our app.
Community Feedback
Of the feedback given, DaClub seems to accomplish its objective of being a central directory for UH Manoa's student clubs. The community feedback given points out the site's ease of use and smooth navigation across pages and features. Clubs were presented in a neat and aesthetic fashion. When it came to functionality, the users commented on the minimalistic and intuitive approach in the features, noting how easy it was to sign up, edit profiles, and even changing passwords. As for the design aspects, they were described as organized and simple yet well executed.
The community did highlight some of the site's shortcomings. The most prominent was the lack of a way to quickly sort through clubs via a lack of a bottom or top page button and a proper filter. A recommended improvement was to add a sort based on category like 'computer' for computer science related clubs. Another suggestion talked about chat rooms or bulletins where clubs can post events or news, helping people to get a gaige of what to expect for events rather than just looking at the descriptions.