Marketing Cloud App

Mobile System

Project Overview

The Marketing Cloud App is a comprehensive platform designed to streamline real estate transactions and management by providing sales professionals with intuitive tools and centralized data access on both desktop and mobile devices.

TIMELINE

6 Months

MY ROLE

Research, UX Design,

UI Design, Motion Design

TOOLS

Figma, Sketch, Photoshop, Adobe After Effects

KEY SKILLS

User Research, Wireframing, Prototyping, Design Library, Testing

Background

Ideamake Technology Co. specializes in delivering advanced technology solutions to real estate companies, enhancing their operational efficiency and digital capabilities.

At Ideamake Technology Co., we recognized the urgency of transforming the real estate sector during the pandemic. Our challenge was to develop the Marketing Cloud App, a powerful platform designed to revolutionize how sales professionals navigate real estate transactions and management. With a focus on delivering intuitive tools and centralized data access for both desktop and mobile users, my mission as the UI/UX designer was clear: to create an experience that empowered real estate professionals at a critical time.

The Problems

Inefficient Management

High staff turnover led to ineffective customer resource management

Fragmented Information

Inadequate tools hindered sales teams’ client engagement

Business Objectives

Enhance Data Handling

Redesign the desktop backend system for streamlined sales processes.

Empower Sales Professionals

Develop a mobile app with essential tools for improved communication.

Design Process

My journey as the UI/UX designer was comprehensive, covering every aspect from initial research to post-launch testing. Here’s how I approached the design process:

On-Site User Interviews

To lay the foundation for the Marketing Cloud App, I conducted in-depth on-site interviews with key stakeholders. By employing a structured approach, I uncovered critical pain points and feature needs. Each interview allowed me to delve into user workflows, frustrations, and expectations, which were invaluable for shaping a user-centered design.

To gather qualitative insights from real estate managers and sales professionals regarding their experiences and challenges with the existing systems. Here are some key questions：

Can you describe your role and responsibilities within the company?
What challenges do you face with the current real estate management system?
How does the current system impact your productivity and workflow?
Are there specific features or tools you feel are missing?
How do you currently manage and access customer data?
What communication and collaboration tools do you use within your team?
Can you share a recent experience where the system fell short?
What improvements would enhance the system’s usability?
How important is mobile access to the system for your role?
What other tools do you use to complement the current management system?

Due to the tight schedule, we quickly classified the conclusions by hand on-site based on the interview results and created a simple affinity mapping.

Efficiency Needs

Users require a more streamlined system to replace the current cumbersome and inefficient processes.

Training Requirements

There is a need for integrated training tools to facilitate quicker and more effective onboarding.

Key Insights

Data Management

Enhanced data management capabilities and better system integration are crucial for maintaining data continuity and accessibility.

Mobile Access

Sales staff need a robust mobile platform to manage customer interactions and track activities on the go.

Real Estate Personas

From these insights, I crafted detailed user personas that represented the diverse needs of real estate professionals. By understanding their goals and challenges, I ensured that the final design was tailored to effectively address their requirements, creating a product that resonated deeply with our users.

User Journey Maps

I mapped out user journeys to highlight the experiences of sales agents interacting with the Marketing Cloud App. This visual representation pinpointed key stages, actions, emotions, pain points, and opportunities for improvement, showcasing my ability to optimize user experiences and elevate their workflows.

Ideation

Mobile System Framework

To create a mobile system that catered specifically to real estate sales, I initiated a detailed analysis of workflows and content requirements. By synthesizing data from our existing desktop system and user interviews, I developed a functional structure diagram. This diagram not only illustrated the project’s design but also ensured that the mobile system effectively supported the daily tasks of sales professionals.

Sketching

Given the complexity of adapting desktop functionalities for mobile use, sketching became my go-to method for ideation. Working on the WeChat platform, I hand-drew key page layouts, allowing for rapid visualization and iteration. This approach streamlined our design process and facilitated quick feedback, ensuring that the final designs enhanced usability for real estate sales professionals.

Hi-Fi Prototype

Leading the design team, I developed a high-fidelity prototype based on our extensive user research. I started by designing the homepage and critical pages, ensuring they addressed the primary functions identified through our analysis. This prototype became a pivotal tool for demonstrating our vision to stakeholders and guiding the development process.

View Figma Interaction

Contributions

Design Leadership: I guided the team through prototyping, using insights from user interviews and data to inform design decisions.

Homepage and Key Pages: I crafted the homepage and critical pages that prioritized user functionality and navigation for real estate sales professionals.

Stakeholder Collaboration: I facilitated meetings with stakeholders to refine page content and functional frameworks, aligning design with business objectives.

Achievements

Functional Focus: The prototype features a logical arrangement, allowing users to efficiently access necessary tools.

Addressing Complexity: I balanced comprehensive functionality with usability, recognizing that some aesthetics may be sacrificed for clarity.

Improved User Experience: Iterative stakeholder feedback enhanced the design, resulting in a prototype that meets user needs and aligns with company goals.

Home Page

Main Pages

Design Library

To ensure consistency and facilitate collaboration, I spearheaded the creation of a comprehensive design library. This library included a robust component repository that served as a centralized resource for design assets. By providing customization options, we maintained a cohesive user experience while allowing companies to tailor the platform to their needs.

Micro-Motion Effects Design

To elevate user engagement, I designed dynamic micro-motion effects using Adobe After Effects. These included loading animations, icon transitions, and background motions, all delivered as JSON files using Lottie for seamless integration. By adding these engaging elements, I transformed the interface into a visually appealing and intuitive experience, keeping users engaged throughout their interactions.

Mobile Loading

Desktop Loading

Emojis

Testing and Iteration

My commitment to user experience didn’t end with the launch. I played an essential role in ongoing testing and iteration. By actively monitoring user feedback, I identified pain points and areas for improvement, ensuring the design remained user-centered.

Key Contributions

User Feedback Monitoring: I collected and analyzed feedback to pinpoint pain points and enhance the overall experience.
Interface Inspection: I conducted thorough inspections of UI interactions to ensure smooth functionality.
Collaboration: I maintained open lines of communication with product managers and developers, prioritizing updates and resolving issues efficiently.

Through this proactive approach, I facilitated regular updates and iterations, ultimately enhancing the effectiveness and satisfaction of the Marketing Cloud App.

Conclusion

My journey in designing the Marketing Cloud App showcased my abilities as a UI/UX designer, from deep user research to crafting engaging experiences. This project not only enhanced the operational efficiency of real estate companies but also highlighted the power of user-centered design in transforming industries.