UI Combine Screen

The first design for my Combine screen was based purely on the blueprint design. Using a grid I had made following the graphic design grid method, I fitted all the parts on to the combine screen.

Finding this screen very difficult to look at with so much going on, I thought about how to limit the blueprint grid. This led me to think of a ‘desk’ idea with the blueprint on a wooden desk and the combine blueprint a piece of paper in the middle. In addition you could also have kinetic movement with swiping a new piece of paper for each combine. With feedback however the desk theme did not get across very well.

After the desk idea did not quite work it was suggested to me that maybe a shelf or workshop vibe may help. To do this i created a split screen with shelves and more realistic icons that would transfer to the blueprint icons. The reason I have stuck to wood is that many of the items will be metal grey and a metal shelf would make it very monotonous and make some items blend in. Brown will be a far less likely colour to appear in my items.

This screen was just ugly. The blueprint had way to much space but the realistic looking icons looked really interesting even if the shelf was not quite right yet. To help i had to really think about placement. Some icons didn’t work in realistic way so had to be altered. Also with the combine screen more horizontal I thought about moving to shelves above and below rather than to the side.

This final far more aesthetically pleasing look worked much better with placement above and below rather than side to side. The shelf may not be perfect yet but the two design work much better together currently than they did previously.


Leave a Reply

Your email address will not be published. Required fields are marked *