Marketplace.city
An online hub where innovative city governments can source ideas, connect with smart technology providers, and implement solutions with efficiency and confidence.
Context

After seeing success with a localized database of smart technology vendors in New York City, founding partners Andrew Watkins and Chris Foreman wanted to expand the platform to city governments worldwide.

We began work in June 2017, and after launching four months later, Marketplace.city won the Innovative Idea Award at the 2017 Smart City Expo World Congress in Barcelona. Today, over 150 cities are using the platform and the founders have raised $1.2 million in funding.

I worked directly with the two founders and the product manager to design the functionality of individual city pages and the onboarding experiences for cities and vendors, as well as supporting the engineering team leading up to the launch.

I also later worked with the Art Director and UI Designer to write the copy and design the content layout for a comprehensive homepage that would draw in cities and vendors alike.

Project scope

Define challenges → Generate feature ideas → Information architecture → Wireframing → User testing → Iterating → More user testing → Design → Fine-tuning → Development → Launch

This case study covers the four months I spent leading the product design and an additional 2-week sprint on the homepage.

Team
  • 2 Founding Partners
  • Product Manager
  • Product Designer - My role
  • Backend Engineer
  • 2 Frontend Engineers
  • Project Manager
  • Art Director
  • UI Designer
01
Challenge
With a Lager dongle, hardware engineers can communicate to their devices through the Cloud and access their data files from anywhere.
Docklight is an industry standard software that hardware engineers often use for their serial communication needs when testing and debugging devices.


Our challenge was to maintain feature parity with Docklight while solving three big problems it presents:
1. It requires you to plug in your device with a USB, limiting distance and movement allowed during testing
2. The files it spits out directly onto your computer desktop are poorly named and pile up quickly.
3. The interface is cluttered and non-intuitive

While the team was hard at work building a wireless dongle that communicated through the Cloud, I worked on designing an experience for hardware engineers that would help them organize their data files and move about the interface with ease.


My challenge was to maintain feature parity with the industry standard software, Docklight, while designing an experience that would help hardware engineers organize their data files and move about the interface with ease.
All major real estate companies use the same configuration for their search page: a search field and filters above a split screen of listings in a grid and a map.
01
Challenge

Though every city is unique, they often share the same problems, like trash removal efficiency or keeping bicyclists safe.

Cities need a way to find solutions to their problems by looking to other cities for inspiration and being able to search for technology using city-specific taxonomy.

Our challenge was to create a new kind of online network where city employees can connect with each other and with smart technology vendors.

02
Discovery

I listened to Andrew and Chris’s vision for Marketplace.city. They explained to me how cities solicit solutions to their problems by posting Request For Proposals (RFPs) on their website which begins a long process of evaluating submissions and making decisions.

They showed me a list of features they had brainstormed together:

  • City employees can sign in with LinkedIn and have a profile pre-filled
  • Cities could use their page to highlight their APIs and Data Portals
  • Cities could highlight their priorities and pilots
  • Vendors could post their solution they provided to a city and a city employee could validate it
  • Cities can leave reviews of vendors that could be viewed by other cities

They also gave me a timeline with two important events: the Harvard Smart City Innovation Accelerator, where they were planning to workshop their idea, and the Smart City Expo World Congress where they planned to submit the live site.

03
Process

Getting feedback directly from city government employees was going to be the key to our success.

Although the Harvard event was coming up soon, I started with a broad look at the site we were building before jumping into sketches of the city page.

Using their feature list and the existing Marketplace.NYC vendor database, I created a sitemap, site outline, and list of benefits so that the team could have an idea of the structure and purpose moving forward.

The site outline detailed what each page was for and what a user should be able to do.
Listing the benefits of being a city in the network or a vendor in the directory was a way for me to capture the features we talked about in the Discovery.

Next, I quickly grabbed some placeholder content from Seattle.gov and started making wireframes for the city pages. I had to work quickly so they could show high fidelity mockups at the Harvard event to get feedback.

My goal was to surface enough information that the user wouldn’t need to click very often, but I also wanted to be mindful of the cognitive load that can happen with a wall of text.

A few variations of the city page.

The wireframes helped us realize we were highlighting the wrong information.

RFPs were a revolving door, but the city’s resources and important links were mostly set in stone and conveyed a lot of information about the city’s endeavors.

Using the UI design from Marketplace.NYC, I made a high fidelity mockup of the city page for New York City.

Switching the RFPs with Resources allowed us to use a carousel to display one RFP at a time (the number of open RFPs changes often), and use images next to the city’s resources to break up the text on the page.

Andrew and Chris would also be showing the vendor page at Harvard, so I started on that next.

Because they had already built a vendor database for marketplace.nyc, I started from there and made some enhancements based on the features they envisioned.

Left: Product page from the Marketplace.NYC vendor database. Right: Updates I made based on our new feature set.

While the founders were at the Harvard event talking to users in person, I wrote a survey to send to employees of our partner cities (cities that would be on the platform at launch).

One person's feedback from my survey.

Distilling feedback into actionable next steps was important for shaping the product to meet their needs.

Some of the feedback had very explicit next steps, but others required me to think about why the user may feel that way and come up with solutions that fixed the root cause.

Our final step before launching was to consider the onboarding experiences for cities, city employees, and vendors.

Onboarding for cities would require a lot of work up front, so I considered the pros and cons of experiences ranging from white glove to hands-off.

A few examples of the city onboarding scenarios I wrote.

The onboarding for city employees is a simple sign-up form and profile page.

When vendors sign up, they can choose to have their company listed for free, or pay a fee per product they want listed in the database.

04
Solution

Marketplace.city is now home to over 150 innovative cities around the world.

I worked with the Art Director and UI Designer to design an informative, interactive homepage. I used wireframes to plan the content placement and collaborated on the the copy.

You can browse through city pages on the live site: marketplace.city.

Final Thoughts

With this project, I was able to get a lot of useful feedback directly from our users. I have immense respect for both the government employees and smart technology vendors who work together to solve some pretty complex problems.

It was fun to browse the vendor database and see so much impactful technology waiting to be implemented. It's exciting to know that Marketplace.city is making the process of finding the right technology for your city much easier.

Go back home