top of page
Writer's pictureFisnik

App & Website Design — Research

Updated: Nov 30, 2018

The currency will be app focused. This is where the majority of interactions will take place - the element of exchange and trading. I have thought about incorporating a webpage which would act as the currencies F&Q and sign up - it would do nothing else. In this blog I look at some app and website design, in terms of productivity, time and currency.

Screenshot of https://bench.co/friends-of-bench/

The website is for business to hire someone to do their bookkeeping. The site manages to keep an overall professional look, with the background colour stretching to all corners of the screen, uninterrupted by a different colour menu bar at the top seen in a lot of website design. The site opens with a sign-up forum, something that would be useful for my design. I really like this design because it's clear there was a lot of thought that went into the colour choice and images.



Screenshot of https://canopy.co/app

Canopy is a good example of what I am aiming for in my website. The functions are limited, promoting the app itself. The user can log into their account on the webpage however, it is obvious that this site is only supposed to be used for mundane account tasks like viewing your history. It’s not meant to be used to browse. I could take a few tips from this one.


Screenshot of https://www.curve.app/

This is the Curve app - all your finances in one place. I chose this site because, like the Canopy example, it is promoting the app, but also because I enjoy the 'endless' scrolling design. The positioning of paragraphs makes it seem this is really one long webpage, which it is but separated carefully. I also like the choice of bold colours and how they complement the images.


Screenshot of https://n26.com/en-gb/

This is N26, an online bank coming to the UK soon. I absolutely love this design and branding. The image of a woman gives it a personal touch I have not seen yet in a banking website. Scrolling through the site, there are subtle animations like moving cards. I could take some inspiration from this site in terms of how animation is used. It may also be a good idea to show the personal connection my currency has with a person. This could be done showing an image or short clip of an individual going about their day, gathering ticks.


Screenshot of https://www.wealthsimple.com/en-us/

Wealthsimple - investing made simple and affordable. This site gamifies the action of scrolling down a webpage. It starts off with a coin at the beginning. It then moves down the page, passing these intricate obstacles, proving very useful in grabbing the user’s attention. Made using a series of .mp4 files, quite simple. If I were to do something similar, maybe my currency is moving across the background, getting lost in time until the user manages to click on it, receiving a reward.


 

I then conducted some app design research into apps made with mental health in mind.

The app shown above is Moodnotes, it's an 'innovative approach to journaling' (App Store, 2018). Looking at the user interface, we see how colour has been used to represent different elements of the interface. For example, the second screen shows a happy emotion, with the colour green used. And the third screen shows blue used with the sad emotion.

This is the webpage for Moodnotes. I love it! It's simple, highlights the fact that the app is the main way to use the app and that the webpage is there to explain how it works. The interactive element is interesting. Scrolling down on the webpage changes what you see on the phone screen. This is what I want to replicate in my site.


This is Breathing Zone. "When you find yourself under stress, Breathing Zone can help." (App Store, 2018). The interface is very simple with not much shown apart from these geometric shapes. It is very minimal. There is a strong contrast between the shape in the foreground and the black background. Why has this been done? Maybe so that the user is focused on this geometric shape to calm them down. With no other distractions present, this may prove an effective technique.


This is PAUSE - Relaxation at your fingertip. It's difficult to judge this interface as there is no information being displayed, it's essentially a game. However, I have discussed possible incorporating mini games in my app that will easy the users mind. This is a good example of how I could do that, what games the user can play.

 

Reference list:

  • App Store. (2018). ‎Moodnotes. Available at: https://itunes.apple.com/us/app/moodnotes-thought-journal/id1019230398?mt=8 (Accessed: 29 November 2018).

  • App Store. (2018). ‎Breathing Zone. Available at: https://itunes.apple.com/us/app/breathing-zone-relaxing-breathing/id369838631?mt=8 (Accessed: 29 November 2018).

  • App Store. (2017). ‎PAUSE - Relaxation at your fingertip. Available at: https://itunes.apple.com/us/app/pause-relaxation-at-your-fingertip/id991764216?mt=8 (Accessed: 29 November 2018).

  • Bench. (2018). Online Bookkeeping Services for Your Small Business Available at: https://bench.co/ (Accessed: 11 November 2018).

  • Canopy.co. (2018). Canopy for iOS and Android - Canopy. Available at: https://canopy.co/app (Accessed: 11 November 2018).

  • Curve - All your cards in one. (2018). Home | Curve - All your cards in one. Available at: https://www.curve.app/ (Accessed: 11 November 2018).

  • N26. (2018). The Mobile Bank — N26 United Kingdom. Available at: https://n26.com/en-gb/ (Accessed: 11 November 2018).

  • Moodnotes.thriveport.com. (2018). Moodnotes | Capture your feelings, improve your thinking habits. Available at: http://moodnotes.thriveport.com/ (Accessed: 29 November 2018).

  • Wealthsimple.com. (2018). Available at: https://www.wealthsimple.com/en-gb/ (Accessed: 11 November 2018).

0 comments

Recent Posts

See All

Comments


bottom of page