Advanced Graphic Design Studies

[sanafromcollege]

[sanafromcollege]

Tote Bag Mockup

I can say that after this project I have a better understanding of the fundamentals of meeting the criteria of a competition brief. I have some understanding of how individuals from a collaborate team would work together to create an outcome through some market research. Creating an app requires people for various job roles ranging from creative roles and people who have experience with creating the functionality within an app such as the app developers. I found it fascinating how people from different job roles will work together to create the final end result. I also understand why it is important to have a plan before you launch a product such as finding ways in which you can make the target audience aware of a brand or franchise. In my case because I have designed pages and mock ups for an app to use used in a supermarket them it would be a good idea to advertise the app indirectly through promotional items such as having the app logo on a tote bag you can find instore. 

My tutor Sarah has suggested to create a tote bag mock up

[sanafromcollege]

This is how the final version of the shopping page within the app Ready Set Tesco. This is how the screen will appear for when a customer scans an item instore, They are able to see a colourful illustration of the item they want to purchase. It makes this app page overall appear as jolly which is good as I want Tesco customers to feel welcome when shopping at a Tesco store. 

On the top of the page here you will see your point tally increasing for when the customer scans an item, the overall points will be visible for the shopper for when they scan an item. 

At the bottom right hand corner the customer is able to see how much they are spending overall. It is useful for the consumer to be notified of costs so they will be aware if they are going over an intended budget.

All the app features on one page:

shopping basket - When selecting your grocery item you are able to send it to your digital basket by selecting this icon of a shopping basket.

discount - The discount icon will notify the customer of any discounts available to them with just one tap of the icon.

product locator - Navigates the customer to the desired item on their shopping list.

countdown - The countdown timer will inform a customer whenever they exceed the time they intend to shop instore. 

[sanafromcollege]

Here is all the fruit illustrations I have designed to be used on the app Ready Set Tesco, I found that keeping a restriction on the colours used works well. These illustrations overall are lively and fun, I know that the illustrations will make the app stand out in terms of the visual imagery used. using curved lines really do make Tesco seem like a wholesome supermarket to buy from. 

[sanafromcollege]

This is the shopping page within the app, I found the use of curved shapes to work well here. before creating this final mockup I mainly used sharp edges shapes within this pages app design and it did not work well at all. This is a concept example of the pages layout to see how the features can potentially be arranged. I wanted to make sure the apps layout is simple and easy to understand for the consumer.

These app page examples don't showcase the product locator in action, this tool was extremely useful to pinpoint the customer to the aisle where their item is located.

I didn't like the set up of these app pages as it felt quite bland and I didn't think the overall layout worked it felt too stiff. This is why I thought it was a good idea for the customer to have a live view of the store through their phone. I knew this idea wouldn't have worked with the layout shown above. The written text had to be re arranged and positioned well on the page, the informational text should be displayed either at the top or bottom of the shopping page but not at the very centre where the live view of the store is going to be

[sanafromcollege]

Icons for the Tesco app ‘Ready Set Tesco’ Using the Primary Colours of Tesco

The Tesco gift box symbol was an idea I thought was a pleasant way of receiving surprises from Tesco such as offers and promotions. This icon Doesn't work well for the app however because theres too much detail going into it; another problem with this icon idea is how the Tesco ( T ) has been changed. As a general rule I shouldn't distort the Tesco logo in any way in this project, I need to remember that the outcomes need to be relevant to Tesco. 

The logo I have made here is from the perspective of how the phones position would be if you saw a individual using the Tesco app ‘Ready Set Tesco’. I have incorporated a mobile device into the design as the app was made to be used inside of a Tesco store.

[sanafromcollege]

Ready Set Tesco’s Count Down Timer

Here you will see a count down timer icon I have made for the app ‘Ready Set Tesco’; here I was experimenting with having the clock and name of the app placed together in various ways. I was told that this would make a good icon for the app compared to the one I made previously. I quite like the stop watch timer for the simplicity and the relevance it has to how the app will be used on game mode. You have to collect all the groceries on your shopping list before the timer goes down. 

My tutor thought the arrangement of having the words ‘ready’ and ‘set’ at the centre of the timer was a good idea here. some feedback I received included using a different font as the font here doesn't work well. For this experimentation work I was using Myriad Variable Concept font, it would be a good idea to experiment with multiple font types and to write down which ones I want to use within the app.

[sanafromcollege]

[sanafromcollege]

Aim for week 12

Create a written rational

Explain the features of the app in clear detail

Have a diagram of how the app works 

Have a final name and logo for the app

Market Research

By explaining the features of the app with written text and diagrams I will be able to clearly justify how the app functions. 

Having a good amount of market research is crucial for understanding how to aim towards the target demographic.

[sanafromcollege]

Digital Icons

These are digital icons of fruit which I have created on illustrator, creating these outcomes digitally gave me the opportunity to figure out which illustration style works best. The two illustrations on the right hand side are the ones which I created first, I didn't like them for the reason that they just didn't suit with the aesthetic I was going for with the app. The illustration of the banana felt too sharp edged, whenever a customer opens the Tesco app I want them to feel quite eager. This illustration does not give off a fun vibe for the app which is meant to give a good experience to the customer. I have resolved this problem by using the anchor tool options in illustrator to 

I found the second illustration on the right hand corner to lack a sense of intricate structure, this in turn does not suit well for the app and looks very out of place in comparison to the illustration of a banana. After applying structure to this I still wasn't satisfied, in my opinion I do not find gradient to work well here. I have decided that as a rule I wont apply gradient to any illustrated objects for the app.

[sanafromcollege]

Illustrations of  food objects and Ideas for the features of the app

How it will appear visually 

[sanafromcollege]

Illustrated Fruits and Vegetables in a Pixelated Style

Doing this illustration as experimentation was quite fun as I have gotten the opportunity to create block like examples. Even though these wont be used on the Tesco Experience app it was still a good example of experimentation work to add into the sketchbook as I now know this very edged style doesn't suit with Tesco’s aesthetic. 

[sanafromcollege]

Icons

the icons displayed here showcase digitalised versions of icons I have previously drawn out in my sketchbook. The first set of icons were experimental, I wanted to see which icons could work the best when used within the Tesco app. For the second set of icons I have Have experimented with creating live paint objects within illustrator, I have done this to include a level of intricacy within the icons. The feedback I later received from my tutor included trying to experiment with adding on solid colour to these icons instead of just keeping them as an outline.

For this page of icons in particular I didn't include solid colour because I wanted to pay great attention to having a consistent colour scheme for the Tesco Experience app. I was going to have a primary set of colours consisting of The brands colours red and blue. The secondary colour scheme will mainly be used for any illustration included within the app. 

I have also been told how if these icons were used it would make Tesco appear as a serious brand, so it would be better to tone it down by adding in curved edges. I need to remember that this app is supposed to represent Tesco in a wholesome way. 

[sanafromcollege]

Game Mode 

Features on This Mode of the App

[sanafromcollege]

Symbols of the customers shopping experience and features on the app:

The countdown timer feature on the app and symbols of a good shopping trip.

[sanafromcollege]

Help Guide Feature on the App

[sanafromcollege]

Timetable for Week 9 + 10