The All-in-one Basketball app for players

Client: PullUp App Co.

Services: Creative Direction, Project Management, Brand Strategy, User Research, User-Experience Design, User-Interface Design, Brand Development, Website Design, Website Development, App Design

Software: Adobe XD, Illustrator, Photoshop, Acrobat Pro, Webflow

PROJECT SUMMARY

PullUp is an all-inclusive basketball app that allows its players to efficiently locate nearby courts, invite friends, and play local basketball. Users can review detailed information within the app, including active location/ court hours, best playtimes, competition levels, and much more. PullUp is the first of its kind to allow basketball players, who prefer to play local games, to have direct access to detailed information before arriving at a local basketball court. PullUp was built from the ground up into a fully developed app and brand.

DISCOVERY

Before starting this project, the client and I outlined the current problem with local basketball apps. We saw the most significant issues: none of them were recently updated or lacked detailed information on courts in our area. The client also noted that he always had to spend time inviting his friends to play, giving them his location, and then waiting for them to arrive before they could start playing.

Knowing this information, we noted all current problems and started working towards solutions to each issue. This process outlined the beginning features of the application. The client and I knew that each element could not go through design, development, and launch within the given time frame and budget; therefore, we need to create a consistent common ground of app elements, brand assets, and visual language before starting the development process.

App screen mock-up
App screen mock-up 2

DEFINITION

Understanding our problems and solutions is one thing, but understanding who we need to design for is another challenge. Before I created any design elements, I defined who our users are into three age categories based on the client's knowledge of players who actively play on open basket courts. These three categories were; young (16-21), middle-aged (22-29), and older (30-39). Based on this knowledge, I created three user-personas (two shown below) for each example user within the categorized age ranges.

After completing the user-persona process, I started brainstorming the app's user experience and aligned the client requested features with defined user-personas. This alignment allowed for the first iteration of the wireframe to be created. Creating a wireframe enables the team and me to understand what screens and features are needed to achieve a consistent user experience. 

user personas (pullUp app co Use only)
early UX wireframe
early app screens & wireframes
App wireframe & Screens (intentionally Blurred - undeveloped screens are shown)

ACTION

After defining the app’s user experience, core features, and essential process, I started designing the brand guide and app screens. Pullup’s logo was designed by Daniel F., a member of my freelance design team. Once we completed this process, I created a detailed style guide based on the branding. This guide included logo sizing, app colors, fonts, and buttons. Completing this process allowed me to efficiently and consistently design each screen for final development. 

During my entire design process, I kept the user’s experience concise as a top priority. The user’s navigation needed to be as effective as possible while also giving the user their essential information quickly. Each screen kept this design function in mind. Secondary data is held within separate sections or pages to allow the user to dive deeper into each court if they want to. Still, it’s not necessary if the user wants to quickly find a basketball court and play, rather than looking through secondary information to go play a game. 

App screen mock-up 3
app screens
App screen mock-up 4

IMPLEMENTATION

Once the client and I reviewed the screens, made edits, and sent each asset to Nielsen Ucles, my freelance developer for PullUp. He compiled each element and developed each screen to become functional on the Google Play Store and the Apple App Store. While the development was undergoing completion, I started designing PullUp’s secondary branding elements. This included a website, social assets, and print assets. 

I only had two goals for PullUp’s website. The first was to inform new users about what the app offers, and the second goal was to drive users to sign up for the app’s beta. I completed these goals by creating a functional and informative site that closely followed PullUp’s branding. Once we launched the site, users quickly learned about what PullUp is and how they can get involved. 

View the live site using the link here

website homepage mock-up
website Details mock-up
social posts