iVENDING

About iVENDING

Achievement

Increase sales of products from vending machines by 30%.

iVENDING provides customers with the service of searching for locations of smart vending machines and purchasing food from the vending machines through the website.

Timeline

3 weeks

My Role

Introduction

iMvending is a company in Taiwan which sells smart vending machines that mainly provide cooked food. We received a commission from them to develop the iVending website.

Design solutions
High-fidelity mockups
Prototype
Branding Design

Deliverable

Responsive Web

Platform

Figma
Adobe Suite (PS, AI)

PROBLEMS

The only way that customers purchase food on vending machines from iMvending is to select and pay for products in person in front of the vending machines. In this case, customers may encounter the following problems:

The waiting time is too long.

Even if a variety of payment methods are provided to improve convenience, the customer's consumption method is still to choose products in front of the machine. Sometimes it is easy to have long lines during the peak hour of dining.

Don't know the selling status of products.

Since the status of the food can only be checked in front of the vending machine, it may happen that some people who dine late or those who have waited a long time in the line find that products have already sold out.

Don't know where there are vending machines.

Since the vending machine can only be stored in a fixed location, only people moving around that location will find the existence of the vending machine.

DESIGN PRINCIPLES

Design principles keep our team true to our original intention when the business may later be at odds with what's good for the consumer.

Second Nature

The experience we create is one that should feel instinctual. Every interaction should come naturally, and all information should be presented with ultimate clarity, brevity, and simplicity.

Complete Product Information

Our designs should provide complete and instant product information including photos, working hours, location, and selling status.

Reduce Usage Steps

Minimize the number of times users move to other pages. Allow users to complete ordering or changing orders on the same page.

THE LIMITATIONS WE MET

Our team was short-handed while we are creating this project cause at that time we were also working on another project. Sometimes I need to pause from this work to support another project.

Due to the front & back-end developers we work with within this project are new grads and lacking in experience, it took a long time to communicate and understand their skill level.

Considering the time limitation and the developers' skill level, I can't design the website too complicated.

USER FLOW

VISUAL DESIGN

Logo

This logo combined two images.
First is a vending machine, second
is the Chinese character "食"
which means “food” and “eat"

Color & Typography

MOCK-UP & SOLUTIONS

Home Page

Type your location on the website to find
out what vending machines are nearby
you. With this feature, improving the
awareness of vending machines also
allows consumers to discover new dining
options anywhere.

Then, choose the vending that serves the meal you want.

Ordering Page

The website provides information on each vending machine and product, including service hours, product pictures, current stock, etc.

Select the food item you want and its
quantity.

Cart & Cheak Out

Choose and pay for food on the website, bring your Pick-Up Code to the vending machine and scan it to get the food you
purchased. Improve purchasing efficiency and reduce waiting time. The products you selected could be edited
or removed on the cart page.

What I Learned?

It was the first time I truly work with engineers, I got to know how every function and screen works and how they make it. Based on it, I realized when I am making any design decision I do not only need to think about users and visuals, but also have to combine engineers' ideas and find out the best solution for the current situation.

Everyone has many different ways of interpreting a sentence, and an idea can be described in many different ways. I learned how to express the same idea in different ways when meeting different people and make sure they truly understand what I mean.

Next Step

If more time can be spent on this project, here are things I would like to work on:

Usability study for the website we created.

Iterate based on the usability study findings