This tutorial will assume you have some knowledge of SketchApp. We are going to design a funky IOS layout for the login view. To start we need to launch sketch and create a new project and use the Iphone 8+ art-board template *you can use any size art-board 5/6/7/8 etc. Once we have our art-board we need to draw 4 ruler lines to give a narrow gutter on the left & right hand side & the top bottom will have a wider margin again this only a rough guide.
Once we have our ruler guides in place next we need to add a background colour i have gone with deep purple #2E205E , next we will add a large circle shape at the bottom section of our art-board and use a darker shade of purple to make the two areas stand out.
Once you are happy with the result next up is adding our login fields the input fields these will be made up of two rectangle shapes both with a border radius of 28px to give the rounded effect and both coloured white, the login button will be much smaller and styled with the same radius 28px but styled blue in colour.
We can also add the drop-shadow effect to all our fields & buttons making them really pop.
Next up is our empty space below for this we are going to give our users further options to login via social media, for my social icons i am using this set Iconfinder social icons
By default iconfinder uses black as the primary colour this can easily be changed to white by using the Fills option on the right when icon is selected, notice we have also put Sign in with in small in the top section and under our social icons the option to register.
To center an object, either in "absolute" or "relative" position, we will only h...