Wednesday, 30 January 2013

OUGD504 // Design for Web // Ipad apps

As i have decided to expand on the web brief and show how my website would work as a ipad app, i did some quick visual research into ipad apps. I looked specifically for apps which used a grid throughout the design and showed imagery in a set structured grid. 

I am wanted to carry out this idea for my ipad app - as the website uses the images in 3 across 2 down grid, i thought adapting this grid to fit into the ipad screen resolution size would work best for the app. Hence why i have looked into apps designed around a grid structure. 

Imagery set out into grids which change in depth throughout the app, these are set at the same size and have the same distance between each image. 

Again you can see that this layout is set out in grid. There isn't any images but you can see the grid structure throughout the page.

Here you can see a solid grid structure in place. Each image is set within the 6 columns and are the same height and width. Even the body copy beneath each photo is the same amount. This works really well on ipad and fits the screen well, making it easy to look through the pages.

Again a good structure used in the app, each image is a different size but it is all still set within the grid structure. This works good to browse through the images, but doesnt look as aesthetically pleasing as everything being the same height and width within the grid. 

Great way to show the images of publications. Here you can see the grid is split down into 3 x 3. Every image is the same size and spaced out the same. This is really effective within the iphone screen size and looks attractive too. 

here we can see that a grid of 2 x 3 has been used, this would be the same grid that i would use and even though its on the iphone screen i think it will work well within the size of the ipad screen too. This structure works best for landscape images, which all mine are, so i think i will adopt this grid and use it within my layout for the app.

No comments:

Post a Comment