DESIGN OVERVIEW.

This design exercise was done in a workshop led by IdeateLabs. It was my first introduction into what collaborative working in a team to solve a design problem actually looks like. The designers I worked with were all at different stages in their career, which made the opinions given very insightful. To wrap everything that we went over in the hour we had, I’ll break up the design process into two steps…

Step One: Understanding the current User Experience.

We approached the Instagram redesign from a lens of shopping with rewards using the app Rakuten. Rakuten is a rewards apps that customers can use to get money back on purchases made at stores they maybe already shop at or would like to shop at. The benefit of an app like this from a business standpoint is two-fold: customers save money and businesses gains customers, which may lead to more sales in the long run.

We assumed that the main motivations behind why a consumer may use an app like Rakuten are:

• Brand Loyalty + Trust — Users are buying from a brand they deem reputable & worth their money.

• Price point — Users may want to save some cash on an expensive purchase.

• Savings — Users may buy the without the discount anyway.

Next, we headed to the Instagram app to inspect the current user flow, pictured below. We found that the current shopping feature seemed easy to use and intuitive. Users go to browse the selection, search the brand their looking for, and then scroll down to find the specific item they’re looking for.

The red flag was the “buy now” button. How often would users utilize that button over the “Add to Cart” button? We put ourselves in the shoes of the user and determined that most users would probably want to keep browsing and to find other items to buy or browse. I kept in mind that the main user flow — purchasing on Instagram — could still be completed without the “buy now” button.

STEP TWO: the IDEation process.

For the last half hour we were given, each designer worked on the design challenge and discussed our ideas at the end. I tried not to be too rigid in my approach to coming up with a solution, instead trying out as many different ideas as I could.

These were my possible design solutions, made in Figma.

For my final design solution, I combined elements from the previous frames that I liked. This included the percentage off discount next to the “Free Shipping” and switching out the “Buy Now” button with a call-to-action button using the Rakuten app.

After receiving feedback, one change I implemented was switching the discount amount from percentage to dollar. The reasoning behind this was that users could perceive $2 off as more understandable and easier to calculate than 6% off. I used the color purple stand out while also sticking to Instagram’s color palette of pinks, purples, and yellows.

The other change made was switching the blue button copy from “buy” to “save,” which was more actionable wording and related to the design challenge at hand. I also flipped the buttons to maintain app integrity, since this was Instagram’s app and they may want to catch users’ attention first.