Case Studies / Midstream

IMPACT

Fast, AI-driven insights for Shopify merchants

PRODUCT DELIVERED

• Web application
• Shopify platform
• Client: Midstream
• Year: 2023

IT TAKES A VILLAGE

• One project manager
• One UX + UI designer
• The Midstream founders


MY CONTRIBUTIONS

• User experience design
• User interface design
• Visual design
• Interaction design

DESIGN SOLUTIONS

Our efforts enabled us to develop an MVP that realizes the product's brand, as well as a modified user interface that promotes clarity and user engagement, upholding the product goal of “No dashboards, downloads, or training—just human answers to human questions.”

THE PRE-DESIGN PROCESS

  • Midstream is a Shopify app that enables users to harness AI. More precisely, Midstream states in the Shopify app store: “Brands collect vast amounts of data across inventory, sales, web traffic, and fulfillment, much of which remains underutilized. Only a small fraction of entrepreneurs know how to leverage their data, but with Midstream, that changes. Midstream allows any user to ask natural language questions of their data and receive precise, dependable answers. No dashboards, downloads, or training — just human answers to human questions.”

  • This project was brief and one that I worked on for only a few days in between other assignments. Upon joining, I found that a preliminary set of wireframes had already been developed. However, I was asked to help further realize the user interface and user experience by incorporating visual design and branding, and delivering a functional prototype.

    The primary goal was to deliver an MVP.

  • Midstream's long-term plans are to integrate with several platforms such as Amazon, Klaviyo, Google Analytics, and Instagram. However, testing the efficacy of the product with Shopify alone was chosen as the baseline for the MVP. Before scaling, the lean version needed to be developed and then tested.

  • This application is primarily an analytics tool, yet the functionality and user interface align with the way a search engine receives and presents information. To enhance the user experience, rigorous competitive research was not needed at all, but rather a mindful towards brevity. I aimed to keep the overall experience aligned with Google’s search experience. Compared to other search engines like Bing and Yahoo, Google takes a very lean approach to information disclosure. During the process, I kept these main characteristics top of mind:

    1. Aim for a minimalist design, emphasizing the search bar and result presentation.

    2.Provide visually clear and prominent answers, free from distracting graphical elements.

    3.Expose primary information and conceal secondary/supplemental information.

THE DESIGN PROCESS

“A pocket data analyst enabled by ChatGPT.” - Midstream

“A pocket data analyst enabled by ChatGPT.” - Midstream

The original wireframe for the login page that allows users to integrate their Shopify storefront with Midstream.

The original wireframe for the login page that allows users to integrate their Shopify storefront with Midstream.

The provided wireframes outlining both states of the Midstream query experience: on the left, the initial or 'empty' state before questions are asked; on the right, the state in which answers are returned.

The provided wireframes outlining both states of the Midstream query experience: on the left, the initial or 'empty' state before questions are asked; on the right, the state in which answers are returned.

The revised “answer” state, showing emphasis on the answer, related questions, and upcoming product features.

The revised “answer” state, showing emphasis on the answer, related questions, and upcoming product features.

Interface component variations

Interface component variations

The finalized login page for users, showcasing current platform integrations and future platform integration options.

The finalized login page for users, showcasing current platform integrations and future platform integration options.

The finalized “home” state for asking questions with question recommendations.

The finalized “home” state for asking questions with question recommendations.

Loading screen while results are being gathered.

Loading screen while results are being gathered.

The finalized results page, showcasing the answer, logic behind the answer, follow-up questions, and upcoming product insights.

The finalized results page, showcasing the answer, logic behind the answer, follow-up questions, and upcoming product insights.

The mobile experience from login to question answered.

The mobile experience from login to question answered.

Fast, AI-driven insights for Shopify merchants. 🎉 (See below)

Fast, AI-driven insights for Shopify merchants. 🎉 (See below)

INTERACTION DEMO

TAKEAWAYS



Lessons:

This project was a quick but rewarding experience, enhancing my skills in interactive design within a fast-paced environment. Key takeaways include the importance of rapid execution and the realization that a product's success extends beyond design, highlighting the need for continued marketing and support post-launch.


Impact:

Truthfully, the full impact of this product eludes me. Until about three months ago, I wasn't even aware that it had been developed and released, as a third-party vendor handled the development. That being said, I included this piece in my portfolio because I believed in the product from the outset and its ability to help merchants make strategic moves towards generating more revenue. Additionally, I simply enjoyed working on it and feel that my objective to create a functional MVP was accomplished.