Project: E.ON Mobile Redesign

After a few weeks of finishing the project, I have managed to get the project up and running on InVision ready for you to view. Also as promised here is the case study report that I’ve been wanting to do. Live Share: https://invis.io/RC8RV7OQ9#/192741686_Login_Final

Research

For a few weeks, I’ve been using the mobile app reviews as ideas for my next project on the android store. Of course, you’d expect user testing to be based around getting actual people to do hands-on testing. I didn’t have that much time as I set myself a 1-week deadline in getting this project finished. A big task I know…but I managed to do it (I think). Starting with this project I identified three major issues:

  • Login
  • Signing up
  • Finding monthly balance
  • Paying for your bill

These were the most highlighted issues from the reviews, also using it myself for my personal use. I also had similar issues with the app. I decided to redesign the app and also give it a fresh UI and fix the UX issues. I started by using Pinterest to see what potential design solutions could work. Here is my board https://uk.pinterest.com/kaamaal/wireframe-inspiration/.

Design

Following the paper wireframe and few iterations, I finally came to the designing after 2days. I had 5 days left so I needed to get everything together. The designing/testing took roughly 3 days for about 5 hours a day, which was enjoyable. I loved the whole building process, I know it’s not perfect but getting back into the swing of things was my awesome.

The login page was simplified making it easier for you to log in but also offering a social login option which again will make the process quicker. The new design follows the popular flat design trend which I thought would suit more than the current design they have which is slightly dated.

The three step pages allow the user to still do the same as the was able to before but with this design you have a simple 3 step function. Before finding your balance was quite a long process and I couldn’t seem to find it quickly enough or I ‘d give up.

Balance Check

The balance page shows you a small breakdown of your bill but also a split of how much was used that month. Again, users didnt know which they had used and how much. Before it was one big bill with no breakdown.

Payment method

Pay via your personal card linked with the app which acts as a virtual card or you can use Paypal/Applepay as a secure method.

Successful Payment

After the payment has gone through you will be taken to a successful page which gives the user two options. They can return to the main menu but also download the receipt for the payment directly into their phone should they have ApplePay or Andriod pay in use. You will also receive a confirmation email that everything has gone through.

Register new user for app

Some users need when trying to sign up can use this form but also a new feature I’ve seen from my research is fingerprint sign up. At the bottom of the vector I’ve put that as an option for a quicker sign-up. Removing the option for users to use the form should they do not want to.

Evaluation

I think this project went very well, I managed to fix all the issues that were identified from the mobile app reviews. If I was to do this project again I think I would possibly code up the mobile app so that it can be fully functional. Although you can use the app now in a simple tap format on inVision I ‘d have preferred to code it if I could. Any feedback would be appreciated. The current UI is designed for IPhone 7 which may be why you get slightly cut off at the top of the app.

Live Share: https://invis.io/RC8RV7OQ9#/192741686_Login_Final

Thank you again for reading, follow me on on my social media accounts below and check my previous post too.

Twitter http://bit.ly/2cDZPoT

Previous Post: http://bit.ly/2e6LFPy