Analyzing The existing app

Choosing to begin with the customer-facing side of the app, I needed to see what the company had currently. During my discovery, I found that the color scheme was uninviting, the UI was confusing, and there wasn't a clear user path for planning an event. Based on the pre-determined user needs, I marked the top 3 main necessary improvements:

• Data connection between users, vendors and TTG admins

• Clear event creation and management processes

• Brand identity overhaul

I knew that, as the project progressed, a myriad of additional problems would be uncovered; however, I also knew that they would likely fall under one of those 3 main points of opportunity. This allowed for a clear understanding of how all of the problems could be remedied within the same solutions.

Understanding Stakeholder pain points

Once I understood what event planners would be looking for, I held valuable calls with the company stakeholders, taking note of the internal struggles they had with their current app. Through several zoom calls with the CEO, COO, CBO, and marketing manager, I noted the following top desires of the team:

• Event planning with booking options for vendor services, TTG services, and food and alcohol delivery
• Customizable event creation with seamless booking flows
• Easy filtering and discoverability for partnered vendors
• Accessible communication between users, vendors, and admins

learning the users' pain points

In order to get a well-rounded understanding of the mountains that event planners faced, I knew that I needed to spend some time putting myself in their shoes. Through extensive research, I found that event planners have a lot more going on than meets the eye. By creating 3 personas to represent exactly who I was designing this app for, I became intimately familiar with the users I needed to keep in mind:

• The professional event planner Angie (shown above) who needs things done quickly and efficiently
• The motivated yet inexperienced, business-minded event planner Jamaal (not shown) who needs guidance
• The experienced event planner Shay (not shown) who values inclusivity and diversity in options

What do we need to accomplish?

Now that I had an idea of what the stakeholders wanted and what users needed, I led my team through several brainstorming sessions. We utilized FigJam for this, rapid-fire sharing ideas. I encouraged thinking outside the box, letting my team know that it was better to narrow down ideas than to later try and come up with more. We brainstormed the following questions:

• Why are users coming to the app?

• What do users what to accomplish once they're here?

• What specific tasks might users want to accomplish?

• How can we implement reviews effectively?

These exercises helped us broaden our understanding of what we were setting out to accomplish and set the stage for designs.

Note: other designer's name is redacted for privacy

Investigating the "competitors"

After taking some time to understand the expectations of both the users and the stakeholders, I sought how similar companies were attempting to solve similar problems. I found that most apps were geared towards event attendees and not event planners. There were very few, if any, resources for people doing the actual planning of the events that everyone was so excited to join. I also found that there weren't any apps currently on the market that singlehandedly provided all of the services an event planner would need, forcing planners to use multiple apps.

My search for existing solutions led me to explore a plethora of apps, including the following:

• Uber Eats
• DoorDash
• Eventbrite
• Meetup
• Peerspace

As far as end-to-end event management went, particularly in regard to external vendor collaboration, one thing remained certain:

Existing platforms were incredibly limited.

Consistent and trustworthy identity

Once the app was in user's hands, it was important that, at the core of it all, TipsyToGo evoked luxury, consistency, and trust across all 3 versions of the app. I asked myself if their current color palette conveyed these ideals, and the answer was simply, no.

I started the redesign process by reimagining color palette and the way each color could be used. The logo already had tones that exemplified luxury, class, and warm invitation, and so it only made sense that those hues were used in the app. I knew the brand identity would come to life once I addressed the following:

• Color palette and usage

• Typography

• Component and elemental standards

With this in mind, I developed a design system for teams to reference both throughout the design of the new app and afterwards for marketing purposes. This laid the groundwork for a consistent and compelling brand identity throughout all platforms.

Color palette and usage

By cross referencing the colors in the pre-existing TTG logo with my color theory knowledge, I found that the colors already in use were in fact in line with the brand's identity. With a few tweaks, I knew the pinks, blues, and purples in the logo could represent the brand truthfully and authentically. The previous app was so dark and intimidating, and I wanted this rebrand to show another side of TipsyToGo. After all, TTG is a woman-owned, tech-forward company, a very important aspect that needed to be honored. To accomplish this, I opted to soften some of the main logo colors to evoke a sense of femininity and softness. By also introducing blue hues such as Periwinkle and Blueberry (shown above), I aimed to keep the brand inclusive to all genders while still maintaining homage to the CEO.

• Pink

  • Emotes

    • Femininity
    • Creativity
    • Calmness

  • Effects

    • Motivates action
    • Encourages creativity
    • Communicates calm energy

• Blue

  • Emotes

    • Trustworthiness
    • Confidence
    • Loyalty
    • Success

  • Effects

    • Reduces stress
    • Creates calmness
    • Enforces security

• Purple

  • Emotes

    • Imagination
    • Royalty/luxury
    • Artistic

  • Effects

    • Inspires
    • Encourages creativity
    • Creates impression of luxury

Within the color palette guide, I also included a usage map and approved gradients. The usage map would allow for a visual representation of which colors should have dominancy on any given frame. By assigning "background" and "accent" roles to the main colors, any creative team within the company would be able to easily accomplish this. The approved gradients would also allow for flexibility in usage and representation throughout.

typography and accessibility

After I laid the groundwork for the next color palette, I knew that the next friction point was the typography system. Currently, there didn't seem to be any rhyme or reason to what fonts were used, or how. The TipsyToGo stakeholders wanted particular fonts to be used, so while I wasn't given the flexibility to choose the fonts, I did ensure that there was a typography system in place that would ensure consistent, usage, spacing, and accessibility standards.

As referenced in the snippet above, I mapped out which fonts would be used for what purposes, including the following:

• Headings
• Subheadings
• Body text
• Inline links
• Accent text

Each of these purposes included the font name, weight, case, line height, letter spacing, and pt size, as well as an example of what this would look like. This eliminated any excuses for second-guessing or lack of consistency across digital platforms.

Knowing that these colors and fonts would also be used outside of the app (marketing emails, social media, etc.), I included a quick reference guide for maintaining an AA contrast of at least 4.5:1. With this guide, any creative team within the company would know what font color could be used on what background at a glance. I made sure to note whether each pairing met AA or AAA guidelines as well.

component and elemental standards

Top further ensure consistency throughout the app's redesign and development process, I utilized a Figma plugin called "Specs" to quickly map out the specifications for each element in the app. I creative these breakdowns for the following elements:

• Item detail modals
• Confirmation floating modals
• Vendor cards
• Homepage headers

• Booking request modals

  • TTG services
  • Catering services
  • Package-based services
  • Order-based services
  • Simple vendor services
• Booking request cards (vendor mode)
• Business insights card (vendor mode)
• Pie chart and graph cards (admin mode)
• And much more...