Task 2 - Banking App

With your newly acquired ThoughtForma skills, the next challenge is to construct a more complicated prototype page which could serve as the starting point for a Banking App. The task is to create a page which resembles the one in the image below. Furthermore, add navigation to the Hello World page that you created in Task 1. Try to make it so that when you click on the globe icon it navigates to this new page. Use our Layouts page as a reference guide.

Task 2.png

Tips 

Home Page

Setting 'Home' as the name of your Page piece will cause the Previewer window to load that Page when your first open it.

Profile Image

For the profile picture you can use your Linkedin picture by right-clicking on your profile image in LinkedIn and selecting 'Copy Image Address'. This can then be used as the source url for an Image piece.

Chart Image

You can use the following URL for the chart image: https://ak.picdn.net/shutterstock/videos/15215122/thumb/7.jpg

Icons

The icons used in this app are as follows:

  • cog-outline

  • account-supervisor

  • home-outline

  • magnify

Colors

Useful tools for obtaining color values are:

  • Digital Color Meter (Mac)

  • ShareX (Windows)

The colors used in this challenge are as follows:

  • Background: #081419

  • Top icons and text: #FFFFFF

  • Bottom icons: #3A9BFE