Portfolio
Check out my projects
About / CV
Learn more about The man. The myth. The legend
Contact
Like what you see? Hire me.
2019

CASE STUDY: Koin Rewards, an app for a positive impact

+ User Research, Brand Development, Product Design, Website
Ready to get pumped up about sustainability?!
The people in the CC images are!
8 minute read

Some context about the project

This Koin Rewards project is the perfect example of the power of creating an MVP (minimal viable product).

Originally the product was supposed to be a cryptocurrency rewards platform for a younger generation, giving them complete authority over how they spend their rewards collected from various companies. This included using it on any merchant on the system, or selling and exchanging it like a normal cryptocurrency.

After extensive research with users, the feedback overwhelmingly showed that consuming wasn’t as important as consuming responsibly. We live in a different world now where people want to make a difference and protect this world we all share. We’re waking up to the detriment caused by unfettered consumerism and we want to make an impact for the better.

Now users have the option to search for merchants that are operating sustainably and/or making a positive contribution. Users collect Koin for every time they shop with sustainable merchants, with a painless tracking system connected to their credit/debit card or bank account. They can use their Koin for a plethora of different sustainable causes, including but not limited to: offsetting CO2 consumption, planting trees, donating to positive campaigns, making impact investments, and  paying only for sustainable products.

This was a small group project. My role was UX/UI designer and user research. I worked directly with CEO Curt Hopkins, COO James Brown, Head of Retail Laura Wynch and Head of Technology Chris Steel.

Services provided:

  • User Research
  • Discovery Phase
  • Wireframes
  • Brand development
  • UI design
  • Website design and development
  • Merchant CMS design

Discovery phase & user research

This is my initial user research based off of the Koin Rewards product as a cryptocurrency rewards system. I’m currently doing new user research for the pivoted sustainable consumer product. Once it’s completed I’ll do an updated section here on my website. I hope you'll it find helpful and interesting to see our initial thoughts and research process.

We had to split research into two camps: one for users and one for merchants. We created user personas and merchant personas based off of the research done by several phone calls, face-to-face meetings, or Skype meetings from prospective users and merchants. It’s all about asking the right questions, and we went through numerous iterations to get the pertinent information that was needed for the first concept of this project.

Personas

I worked directly with the Head of Retail and the COO of Koin for the user and merchant persona creations. I like to get minimal personas created and then delve deeper into their habits, and what they would want to accomplish using this application. You can see initial concepts and then the polished personas.

Merchant personas
Initial concepts that changed over time

Wireframes

I created job stories [when ____ (situation), I want to ____ (action/motivation), so that ____ (outcome)] for each persona. I then used that information to wireframe various journeys from on-boarding to spending Koin.

I’ve been doing this for so long that I’ve created my own UI for wireframes which allows me to easily slot in simple elements that look high-fidelity. I find this helps stakeholders to visualise it more clearly, and it’s still easy for me to adjust and change quickly if any pressure points arise. I created the merchant CMS in tandem with the app so we could assemble all information needed for both to function properly.

Creating Koin Rewards’ brand

Koin already had a logo (I just recently updated, see below) and a two-colour system when I started the project. I developed a completely new brand around these early foundations.

From the onset, the product was designed for a younger, more informed audience. All imagery was tailored for the risk-takers - the individual that pioneers their own path.

Working alongside their existing colour system, I also wanted to add a lot of bright, kinetic colouring - something energetic, cheerful, and even hopeful. It conveys the idea of a better, brighter future created by our own actions and decisions.

Logo (update)

After updating their product, Koin needed to remove the word "rewards" so they wouldn't be pigeonholed into just another reward product when there are so many out there.

This was a perfect opportunity for me to change the typeface to something more complementary, and to clean up all the geometric discrepancies (let's be honest, mistakes) with the logo they possessed before I started working with them.

You may see the old logo on a few images on here if you're curious.

Updated logomark
Symmetry is our friend
Grid system
Responsive 12 columns
8px baseline
Coral
R235 / G94 / B77
#eb5e4d
Pale-salmon
R255 / G172 / B162
#ffaca2
Dark-purple
R45 / G30 / B67
#2d1e43
Dark-lavender
R116 / G90 / B153
#745a99
Color Palette
Secondary colors
Purplish-grey
R123 / G120 / B130
#7b7882

Typography

I used one of my favourite fonts for this project: Avenir Next. It’s perfect all-round for readability and flexibility. It was a fantastic fit for this project. All that variation helps with the marketing material I created as well.

Iconography

My process for creating these custom icons was to create icons that embodied simplicity and fun. These represented some really heavy problems we have in our world right now (i.e. animal cruelty), and I wanted them to be hopeful and bright.

All pixel-perfect icons were built off of a 48px system that can easily increase in size depending on the usage.

Illustrations

My initial concept for the illustrations was to use the two-colour system in the creation of simple illustrations that would be animated. These would be used primarily on the on-boarding and tutorial screens of the Koin Rewards app.

I envision it animating by painting in the watercolours and giving motion and life to the illustrations. The app is close to completing its second round of funding, and I’ll be updating this area with my animated versions after I get a chance to create them. For now you can see them in all their static glory.

UI elements

Minimalism and simplicity is always my modus operandi when I’m creating UI elements. I wanted something stripped bare, but easy to navigate and understand immediately.

The type of pristine nature we need to fight for

Testing the product

Identifying a few key challenges

As with most projects, getting various coding systems and banking systems to work together is always the biggest challenge. Luckily I work with smart developers to figure all that out. I collaborate directly with them through the entire project, so we can work together to solve any technological limitations that may arise and still make a kick-ass product.

Part of the original remit was to make it an easy plug-in for merchants to put on their existing website. Currently we work on Shopify, with plans to roll out on to all major e-commerce platforms soon.

Initial findings

After creating an MVP product, we soon realised after user testing that a cryptocurrency rewards system wasn’t appealing to our core demographic. They wanted a more informed way to consume products that helped the world instead of being more detrimental.

This helped us to pivot an idea early on in a more cost effective process, instead of putting all our eggs in a product that would be doomed to fail. I’ve always been a huge supporter of the MVP process and it’s always good to see it working properly on a project.

We’re just now launching the updated product and I’ll update this site to include new research testing and the results.

Old website screen
Currently working on an updated website

Launching the product & website

I designed and developed the Koin Rewards website using Webflow. It’s one of my favourite programs to create bespoke websites.

I never use any template website designs. I create everything from scratch. This affords me so much more control over the design and development of the brand and website. With new animation functions, I can create some amazing websites in a fraction of the usual time, and still have the ability to add complex, custom code if necessary.

We’ve only done beta testing so far, with the app launching soon. I’ll update this section with all pertinent information that comes with it.

Various screens
From website & app

Future iterations

Currently Koin Rewards works with Visa, Mastercard and Shopify. We have plans to have it work with Squarespace, Woo commerce, Magenta and Wix very soon.

Coming soon…
Coming soon…
Coming soon…
Coming soon…
Next Project