Helping property managers
track and complete tasks
for 2500+ leads
Duration
April - July 2024
Role
Sole Designer
Collaborators
1 CEO, 1 COO, 1 VP of Marketing
1 Product Manager
& 2 Developers
Platform
Web
At Crew Enterprises, I had the opportunity to design the entire product from the ground up. Stepping into this role, the stakes were undeniably high, and time was of the essence. I needed to move swiftly for the team to deliver the MVP on time.
The challenge was clear: design a product that would drive efficiency in managing leads, completing tasks, and streamlining communications—all with the ultimate goal of converting leads into tenants. This case study dives into the core workflows I created to meet this challenge head-on. My goal was to equip our internal teams with the tools to track and follow up with accuracy and speed, ultimately driving operational excellence for the company.
Managing leads just got a
whole lot easier.
The dashboard brings all essential information into one streamlined view, from lead tracking and statuses to property units and conversion rates.
Start by creating a lead from the leads page.
Simply click the "Add Lead" button and fill in the name, phone number, source, property and priority level for manual contacts.
Schedule tasks and log activities all in one place.
Streamline your workflow with an integrated view alongside detailed lead information in the side panel.
Record non-automated tasks and actions in the activity log.
Use text-based input fields to provide details about each activity.
Schedule a follow-up task upon saving the activity.
Add a next task for the lead using the dropdown menu.
View and edit every step of the lead-to-lease stage process.
Track progress, assign and complete tasks in both table and board views.
Draft emails and follow-up with leads using AI.
Start by providing AI with a prompt to draft an email.
Customize the tone of voice that reflects your preferred style.
Generate a draft with a progress bar to indicate loading status.
Enter a follow-up prompt, regenerate the response, or apply it directly to send.
Send chatbot and SMS messages across all properties.
Directly send chatbot messages and easily toggle between AI and live agent as needed.
Compose and respond to text messages, either through the side panel or directly from the SMS page.
A brand new design system, built with scalability and consistency in mind
By blending the scalability of Google Material Design with Vuetify 3 guidelines, I created a design system that provides a unified visual identity. The result is a user-centric experience that remains consistent and intuitive at every stage of the lead management journey.
Redefining typography
With the clean lines and modern aesthetic of the Sans Serif typeface, hierarchy is communicated through differences in font weight, size, line height, and letter spacing.
The updated type scale organizes styles into five roles that are named to describe their purposes: Display, headline, title, label, and body.
Handpicking a color system
A refreshed color system, where each shade is picked for a purposeful palette. Drawing inspiration from Material Design to create an accessible color system that communicates Crew Enterprise's hierarchy, state, and brand.
Colors from the five tonal palettes are assigned to color roles. For example, primary roles are picked from the primary tonal palette, while surface roles are picked from the neutral tonal palette.
Revamping buttons
Each button in our system is meticulously crafted to guide user actions seamlessly. From the subtle changes in hover and pressed states to the clarity of disabled and active buttons, every variant is designed with intent.
Buttons are designed with various states—disabled, default, hover, pressed—and can include icons or be icon-free. These states are managed through components and variants to showcase the different button types.
Creating new building blocks
Built upon existing building blocks, these components empower users to accomplish various tasks effortlessly. Their reusable nature enabled the creation of modal and page components, significantly reducing the time and effort required to develop them from scratch.
Cards showing positive and negative trend variants.
Unread and typing message indication with boolean properties.
Card displays using instance swaps, text, and boolean properties to adapt their content and appearance.
Product Level Impact
+10%
-58s
+124
increase in users successfully completing tasks
drop in average time taken in
logging activities
new users added since launch of
the product
The journey up until here has been a rollercoaster of highs and lows.
Join me in uncovering the pivotal moments that shaped both my craft and mindset, propelling me toward a deeper understanding of design in a high-paced environment.
Discovery
Ideation
Design
Testing
Feedback
Iterations
Results
Learnings & Reflections