Rec Admin

Rec Admin

Contract

Overview

Rec is technology company that partners with local Parks & Rec departments and community institutions to enable people to play more.


They simplify the process of accessing sports facilities, fostering the discovery of new hobbies, and promoting community connections through various recreational activities.

Role

Lead Designer

Tools

Figma / Figjam
Linear

Timeline

4 weeks

Links

Contract

Overview

Rec is technology company that partners with local Parks & Rec departments and community institutions to enable people to play more.


They simplify the process of accessing sports facilities, fostering the discovery of new hobbies, and promoting community connections through various recreational activities.

Role

Lead Designer

Tools

Figma
/ Figjam
Linear

Timeline

4 weeks

Links

Contract

Overview

Rec is technology company that partners with local Parks & Rec departments and community institutions to enable people to play more.


They simplify the process of accessing sports facilities, fostering the discovery of new hobbies, and promoting community connections through various recreational activities.

Tools

Figma / Figjam

Linear

Links

Role

Lead Designer

Timeline

4 weeks

home

painpoints

a multi-tiered system

a multi-tiered system

a multi-tiered system

problem

Up until now, Rec prioritized the development of customer-facing products to streamline scheduling, booking, and exploring diverse class options. However, the company lacked an infrastructure that enabled Parks & Rec departments to schedule reservations on their own accord

01

Operationally Intensive
Parks & Rec employees lack admin access, forcing them to email Rec directly and requesting us to add something to the schedule for them

02

Limited Visibility
Once reservations were booked, employees had no way to access the information

03

Lack of Design System
Developing a new product meant we needed a new library of visual components and branding that differentiates itself from the consumer facing product

painpoints

problem

painoints

user hierarchy

user hierarchy

user hierarchy

users

01

Rec Admin

Edit User
Booking

Rec employees possess master access over all locations

02

External Admin

Publishing a
Class

External admins are Parks & Rec specific employees - these admins will have location specific access depending on which city they work for

03

External Observer

Create a
Reservation

Create a
Reservation

External observers are Parks & Rec specific employees - they cannot edit anything and will have view only access specific to the location they work for

thinking

users

Challenge

How can we develop an MVP for a multi-tiered admin SaaS tool that enables admins to access and edit user and class information across all tiers of the system?

rapid exploration

rapid exploration

rapid explore

Thinking

We had a tight deadline of 3-4 weeks to develop final design for engineer handoff. To rapidly explore and refine multiple concepts I developed several high-fidelity prototypes.

This approach allowed me to effectively communicate various ideas, facilitating clear and productive discussions. As a result, we were able to establish a firm direction that solidified the following:

01

Branding

Edit User
Booking

02

Critical User Flows

Critical User
Flows

Publishing a
Class

03

Design System Essentials

Design System
Essentials

learnings

thinking

01

Branding

02

Critical User Flows

03

Design System Essentials

Thinking

rapid hi-fi
prototype

rapid hi-fi prototype

defining an mvp

defining an mvp

defining an mvp

features

01

User Profiles

Edit User
Booking

Allow admins user-specific access to edit player's reservation or information on file

02

Publishing a Class

Publishing a
Class

Give employees the ability to publish classes from admin platform that is linked to front-end

03

Create a Reservation

Create a
Reservation

Create a
Reservation

Enable admins to book courts for classes or private events that will reflected in the court calendar

04

Design System

We need a new design system that differentiates the user facing product from the admin tool

thinking

features

edit user profile ↓

edit user profile ↓

edit user profile ↓

user profile

edit user booking iframe

user profile

edit info iframe

edit club iframe

edit club iframe

edit info iframe

publishing a class ↓

publishing a class ↓

publishing a class ↓

class page

status bar

class page

create a reservation ↓

create a reservation ↓

create a reservation ↓

calendar + court map views toggle

create event iframe

calendar + court views toggle

design system ↓

design system ↓

design system ↓

desktop design system

modals

desktop design system

color palette

text styles

color palette & text Styles

Analyzing our success and shortcomings

Usability Test

Feature 1 | Program

You are interested in the 9-month program; find out some information about the program

Users navigated to program directly but struggled to understand program content and information

Developed a visual language to convey information to make it less text heavy

Mid-Fi Insight

Hi-Fi Takeaway

Feature 2 | Mentor Application

You’re interested in getting involved in a nonprofit as a volunteer mentor; apply to become a mentor.

Users were consistently split between navigating to “get involved” or “mentorship” tab

Provided a visual emphasis for mentorship on “get involved” as it is the most common path

Mid-Fi Insight

Hi-Fi Takeaway

Feature 3 | Workshops

You're interested in attending a workshop but don't know what subjects the workshops usually cover, find a past workshop.

Most users struggled finding “workshops” link within the program page

Provided a separate “workshops” page within the navigation bar

Mid-Fi Insight

Hi-Fi Takeaway

✦ thank you for visiting! ✦ thank you for visiting! ✦

based in

brooklyn, ny

✦ thank you for visiting! ✦ thank you for visiting! ✦

based in

brooklyn, ny

based in

brooklyn, ny