OUGD503 - Work For Creative Advertising Student - App Pages Development

I started with the content screen. This was just a case of fitting the text and image box in place of the Panda.

I used body copy that was 9pt so it was slightly smaller that the rest of the text, and altered the leading to 9.4pt so the baselines aligned with the baseline of the 'My Changes' option in the menu, and with the line that is going through the "How To Help" text.

The top of the image is aligned with the half way point between two of the lines rather than on a line, because putting it on the line left too big a gap.

The fields names were placed with the same 28pt line spacing as the options in the home menu had, and placed boxes next to them that had the same style as the search bar, but I altered the width of them to align with the vertical grid lines.

The arrows are reversed so it implies that when it's clicked it makes things smaller rather than bigger. It's placed with the same gap from the grid lines as the gap between the original arrows and their gridlines.

The twitter feed page didn't really need to follow a vertical grid because the varying length of tweets makes it difficult to keep a consistent grid without leaving big ugly gaps.

The gaps between the text of tweets and the separating white lines are consistent throughout the feed, and the twitter bird is always placed half way between the white separation lines.