CitySmart

02

Problem

Before working with us, Donald had already built a Minimum Viable Product (MVP) to test the product concept. While the MVP helped launch CitySmart, its infrastructure could not scale efficiently as CitySmart grows.

For each new city the platform onboarded, the CitySmart development team had to do custom development to create a new website and two new mobile applications for that city. After onboarding, the content management for each city was all fragmented and done separately from each other.

For business users, the platform lacked a streamlined process for registering an account and listing their businesses on the platform. For the consumers, to get information on a different city, they needed to download a new localized app specific to that city.

When CitySmart gained enough traction to scale, Donald knew he needed to consolidate the different pieces of his platform for all user types (cities, businesses, consumers, and administrators).

03

Solution

Strategy

During our project kickoff, we worked with Donald to identify the painpoints CitySmart faced when the company scales.

During our discussion, a pattern emerged: duplication of effort. Every time something needed an update, the CitySmart team would have to individually update each one of his city-specific apps.

Not only was this expensive and time-consuming, it also prevented CitySmart from rapidly iterating and improving its platform.

To eliminate the duplication of effort, we worked with the CitySmart team to architect a system which would bring all aspects of the platform under one roof for each of the user types.

For the consumers, we designed a mobile app which allows them to easily switch between cities to get relevant information instead of having to download a new app for each city.

For the businesses, especially those who have presence in multiple cities, we designed a centralized content management system (CMS) from which they can manage their business page, offers and events for all their locations.

For the admin users, we designed an admin portal from which the CitySmart team can manage all aspects of their ecosystem such as the number of cities active on the platform, the relevant information for each city, the number of consumers and business users in each city, etc.

With this new architecture, the content management is centralized for the business users and for the administors, while the experience is still hyper-localized and personalized for each consumer.

Successful implementation of this strategy would make CitySmart a much more scalable platform.

Design

With the strategy in place, we worked with Donald to design the user journey for each user type.

After creating the user types, we set to personify each to give them a personality that would make the design become more human-centric. The consumers, average Joes and Janes, would consume content pushed on the platform by the admins and the businesses. The business users, local businesses, would publish information about their business and possible promotions. And the admin will monitor the platform and publish relevant content and news.

From there, we created flowcharts for each user type and dove deeper into the functionality each user would need. We considered why they would use the app, the actions they would take on the app, and what screens would appear when those actions were taken.

After presenting the flowcharts to Donald and receiving his approval we began to wireframe the main screens of his application. In this step, our UX designers created sketches on paper and blueprints for the major screens which had been mapped out in the flowcharts.

For this, we used MarvelApp, as it allows for live collaboration, something Donald was a huge fan of. Having live feedback creates a quick feedback loop during design and keeps the designs faithful to the client’s original vision.

Next, we moved to UI design. Using sketch our designers import the designs to Marvel App, where the client will be able to comment. Once they approve the designs, we finalize them and hotspot each screen.

After 3 weeks and 3 design phases, our team delivered the clickable prototype to Üdo for all 3 user types discussed.

Development

To make sure development move along smoothly and efficiently, we kept Donald and the CitySmart team in the loop on every step of the way.

We worked in a 2-week cadence (called sprint), which we start with a planning meeting to set the goals and deliverables of those 2 weeks and end with a presentation of the result to Donald and his team to get their feedback and approval. Together, we consistently did progress updates, product backlog review, feature prioritization, and quality assurance.

An important decision we collectively made was to pivot to using React Native, an app development framework by Facebook, which allows us to build a cross-platform app (an app which is built once, but is compatible with both iOS and Android). This pivot saved us a lot of time and resource throughout the project.

04

Results

• Team successfully migrated users from legacy platform to new platform

• New platform simplified onboarding work by bringing affiliated sites under one roof

• Improved UX/UI of all touchpoints of the platform (website, web app, and mobile app)

05

Summary

• Upgraded platform architecture to improve scalability

• Added 2 consumer-facing touch points to increase reach

• Created consistent brand experience across 6 touch points of the platform

• Centralized content management system (CMS) for Admin users

• Modernized user interface and improved user experience

• Hit KPI goals and product quality to earn investment

• $200,000 in seed capital from Quake Capital Partners