Daily UI 017 Email receipt

It’s so easy to shop online today. It’s great if you live out of town and just don’t have specialty shops near you. Or if like me you live in NZ, somethings you just can’t get in the shops here, so have to import them. One of the important steps in any transaction is the receipt – The thing that proves you’ve paid for your goods. Here is my version of an email receipt.

Daily UI 012 E-Commerce Shop (Single Item)

Trying to make up time here. Cheating really, as I have not had time to design something from scratch.This is a screenshot of a website I used to have. It was a free WordPress template that I then modified with custom CSS. So although technically not entirely my design given the base layout was provided. I did overwrite certain elements to make them look how I wanted.

Screenshot of e-commerce site for jewellery and art objects

The Z pattern

I think somehow in my last UI attempt “The landing page” I managed to implement the Z design pattern without even trying (yay me). The Z pattern is basically a layout that makes use of how people scan screens (in the western cultures) left to right, top to bottom. Important elements are located at the end points and elbows of the Z. A full explanation of the Z pattern can be found on creativebloq.

The logo (very important) is located top left – identifies the site owner. The eye tracks right across the main nav. The end of the main nav is often where the search is located. It then goes down via the main image to the bottom left button to the bottom right. The last button on the bottom right could be a call to action such as ‘Buy now!!’…not sure people actually buy new cars online, having only had second hand myself, so I thought reading some good reviews might be persuasive instead, but you get the idea.

Web page showing z pattern overlay

Daily UI 003 Landing page

This is a little bit more familiar to me as I work with websites, though not in an advertising space. I have been drooling over the latest Mazda CX3 recently after I saw one in the train carpark the other week. Somehow my 2005 Mazda Demio now looks a little sad in comparison. Still as it says in Exodus, ‘ Do not covert thy neighbour’s donkey’ (or CX3 perhaps?). So I wiped aside my drool, made this page and I shall never think of it again!..fortunately they seem quite rare around here, so I don’t have to see them very often. 🙂

mock up of a landing page for a selling a mazda crx car
Product landing page

Tools

  • Adobe Illustrator