503 - Studio Brief 01 - Individual Practice

Identify and respond to a range of competition/live briefs that reflect your emerging creative interests and professional ambitions within Graphic Design. Select one main brief that will be rigorously developed over the duration of the module as well as a number of smaller/quicker briefs that will allow me to demonstrate my ability to develop effective responses within professionally realistic deadlines.

I need to consider what kind of work I want to produce to build my portfolio and looking into the future what area of design I want to be working in. Areas of design I am most interested in:

• Packaging
• Branding
• Promotional 
• Illustration
• UX Design

With this in mind the following briefs would be most relevant for me personally:

D&AD

Dropbox paper - Take a cause you believe in, and use the power of graphic design to make a difference. Design to agitate, educate, and inspire an audience, or the world, to get behind your cause. Create a campaign or solution that motivates or effects change, in a way that’s relevant to your cause.

Hasbro - There are many games that were big once but have fallen out of favour, or just drifted into obscurity. Think: shove ha’penny and bar billiards in pubs, hopscotch and marbles on the playground, old-timey parlour favourites like charades or I-spy, or simple card games like cheat and shithead. Your mission is to find a forgotten old or traditional game and reinvent or reimagine it for a new audience and a new age. Create something relevant to adults looking for a fun, fast party game: aim for 2+ people, 2 minutes to learn and 30 minutes to play.

Hotel Indigo - Hotel Indigo draws on the neighbourhood to curate the hotel. In this spirit, pick a Hotel Indigo location (existing or upcoming) and capture the essence of the neighbourhood in 1-3 images. Your image(s) should create awareness and authority for Hotel Indigo as a design-led boutique brand with a point of view on what makes an inspirational travel experience.

YCN

The Grown Up Chocolate Company

Street Feast

Penguin

Animal Farm by George Orwell

OUGD504 Overall Evaluation

I enjoyed this module as a whole because it really challenged me as a creative - studio brief 1 was quite restrictive in the design as the contents was handed over and the fact we had to give our ideas and contents to one of our peers taught me that sometimes you have to let go in order to create something good, it was also a good learning experience in the real world of work I will have briefs that I can't really relate to or are that interested in and that is where research comes in and is very important. Although I spoke about not enjoying sb1 that much because it was print, it has made me more interested in this area, although I am still more comfortable with screen based design I am more curious about print and would like to learn more about it in terms of production from indesign to stock choice and binding options - it is good to get out of your comfort zone. Studio brief 2 was a lot more open which as a starting point is quite difficult as settling on one idea is hard, trying to figure out which would be most suitable for my style of design and which will allow me to make the most of the brief. This module has also taught me a lot about time management and organisation, with the print brief a lot of design was involved as well as planning and time taken for production, this brief ended up running into the time left for design for screen however this was okay as the app was a lot faster to produce and refine. One of the ways I kept on top of this submission was to create my design boards for finished briefs rather than leaving them till last minute, I have also learnt to keep my blog up to date when I produce work or do any research as this makes the design boards a lot easier - I know what I was thinking and why I made decisions at the time rather than having to try and think back. Something that I enjoyed was researching UX design as it is a lot more technical and user based than just looking pretty, for an app to be successful the wireframe underneath how it looks must work seamlessly with the navigation allowing access to every page - once this was perfected there was time to make the app 'look pretty'. Overall looking back on work before this module I can see how much I have grown as a designer, both in terms of creative skill but also how I organise myself and manage time, as well as how I act with my peers in critiques and group situations.

SB2 Evaluation

I enjoyed this project a lot more than design for print as I feel it is more the kind of work I would like to do in the future, I also think it is because I feel more comfortable whereas the idea of printing and having all of those considerations worries me. I am happy with the end result and believe the app contains all of the pages needed to function and fulfil the goals - ‘find, look after and show off your plants' by including different sections - my plants, search/scan, social and schedule. The log in is essential so that users can have a social profile, as well as being able to log in across other devices and even be able to share an account if you are looking after the same plants. The colour scheme works well and suits the photographs I chose to display for search results and my plants. It was mentioned in the final crit about perhaps changing the social section to include circles too however when this was tried it looked unprofessional and unfamiliar so I thought it was best to keep it square style - similar to instagram and depop. One page I would add to improve the app would be an option to scan from the main log in options page, if you weren't currently logged in but wanted to quickly snap something and don't have time to log in this would be useful. Along with adding an option to the scan page to add from camera roll, for those photographs you already have and want to be identified. I believe overall the app has a consistent style throughout with only differences being between the my plants/schedule and social however this works to an advantage to differentiate sections. Adobe xd was a really useful piece of software for this brief, it allowed me to go from basic wire frames, to importing photos and illustrator vectors for final designs and then finally adding navigation between pages for prototype which really brought the app to life.

SB1 Evaluation

Overall the outcome for this brief was successful however I believe it could have been better and if I did it again there would be a few changes. One of the main things I would change is the stock of paper it was printed on, 120gsm was too thick for the amount of pages the document had, I would also reconsider the stitch used as again it wasn't most suitable for the size of the booklet, a perfect bind would have been better suited as a bunch of smaller sections however this would have to be achieved by using different options in print booklet. All of the issues I had with this brief came with production, I enjoyed designing the booklet in InDesign and editing the photographs as well as the patch work letters, I struggle a lot more when it comes to working out bleed and creep, the creep didn't work as planned with the photographs in the middle being full bleed when the document was cut and the start and end having some white space as you can see in the photos above. I could have produced a better booklet perhaps by doing a few test runs and more mockups however time wise this wasn't possible as I had to collect the photographs and content as what I was handed over wasn't near enough high quality for print and no information was included, as well as this cost limitations prevented me from printing more than once. I learnt a lot from this brief as it was more what will happen in the working world, you are given a brief and client with contents and have to do the best you can with it by adding your own take and creative ideas. There is a strong concept - an a-z guide to the festival however with this comes limitations, there wasn't much room for experimentation or really out there design as it had to be easy to read and straight to the point in showcasing the festival. 

Software Evaluation

Design for print

Software used: Indesign, Illustrator and Photoshop

For this brief I used all of the above a fair amount for different reasons. Photoshop was used to edit photographs used for content, for print photos have to have a minimum of 300ppi and must be resized after being placed into indesign. I also used photoshop to crop photos down and adjust the brightness and contrast. I used illustrator to create the alphabet in patch work, utilising the pen tool, text and ruler/guides, at first a letter was taking me a long time to create however once I got the hand of it, it was much quicker work and using copy and paste for certain sections of the letters worked. The third piece of software I used was Indesign, from the start I created a folder in finder specifically for all of the contents that would be added to the document - this is because links are created when using indesign to the files, for example after editing a photo in photoshop then saving it as a psd, you can go from indesign directly to photoshop to edit and it updates in real time when you save which is a lot quicker than editing and re placing the file. Indesign was the best option to develop the layout as it has options for margins, columns, bleed etc and then when it comes to printing the print booklet option helps with organisation depending on what bind you have chosen. I couldn't have completed this brief without the help of all these softwares however indesign is the one that brings everything together.

Design for screen

Software used: XD, Illustrator and Photoshop

Similar to design for print I used Illustrator and Photoshop to create the components needed for the app design. I created the icons for the menu bar in illustrator then pasted them into XD, edited the photos in photoshop and pasted them in XD,  it would have been possible to create the app without the help of these softwares however the app would look a lot more basic as XD only allows you to create very simple shapes - it is more for creating wireframes and adding everything to finish the design. I found XD very easy to use both on the designing and prototyping side of things, the prototype is very useful as it allows you to experiment with navigation to see what works with transitions.

SB2 Final Design

SB2 Final Designs Critique

The page designs have changed quite significantly since the last development blog, I tried out using a white background and believe it looks a lot more professional and more of an app that has different sections rather than just something a garden centre has made. I have changed the design style as I think it is now more appealing for younger people as it feels more of a social media app. The previous design did the job in terms of ux design and containing everything it needed so therefore I could build on the visual design side. 

I got some feedback from my peers:

• Not sure how the green text will look on the pink circles on an actual screen, may be better changing it to white - I did try this however it blended in with the symbols too much not showing the difference between the name of the plant and the care it needed, I also checked what the green looks like on my phone and it is very legible.
• Another concern about how it would look on screen is the text point size on the plant profile for the general and care information however when i downloaded this onto my phone it was very clear and readable.
• A suggestion was to use a lighter shade of green for the location tag on the social photos - this was a good idea as it differentiates the information and creates a hierarchy.
• I am going to change the menu bar again as the current one is too large when put onto actual screen the actual icons only have to be small as that is what we are used to with the phones we have these days. 

I am happy with the feedback I got as it was all concerning small details and nothing fundamental was discovered to be wrong with the app, with this in mind I am going to make a final few changes and start to prototype on XD to show the navigation throughout the app. 

SB2 Development 2

Below are designs for all of the pages in the my plant app in colour and with added icons, it is starting to look more like a functioning app rather than just initial plans. The actual design of the pages haven't changed much but adding colour has helped me realise what needs to be changed. I now have to gather and produce illustrations, information and photographs to help bring my app to life. 

I am going to explore using a white background as this could be a bit too in your face and when looking at other very popular apps the majority have a white background with coloured headers or borders. 

I used illustrator to develop a menu bar with little icons either in block or with outline - at this point the block colour looks better however this could change with the further development of the pages themselves. The back button is self explanatory, home will take you to the options page, search to 'scan/search', leaf to 'my plants' and the profile icon to your social profile page.

SB2 App Development

Font

There are things to consider when deciding what font I want to use for the app:

• It must be legible at a small pt size as there isn't a lot of space on the screen so standard size will be small - clean yet bold font will work well
• I will use the same font throughout the app as there is no reason to have more than one, I will show variation of buttons/links by varying the weight of the font

Possible choices:

Open Sans - a clean and modern sans serif which is optimised for web and mobile interfaces, available in many different weights which is ideal.

Raleway - elegant and a display sans-serif typeface which has 9 weights. This has an extra something about it compared to open sans, more of an individual stand out feel.

San Francisco - designed by apple for use across IOS this would be a good choice for the app as so many people are familiar with it they would feel comfortable with the app straight away.

Colour scheme

"Green is the colour of nature. It symbolizes growth, harmony, freshness, and fertility. Green has strong emotional correspondence with safety."

The obvious choice for the primary colour that will be used in the design is green, as it represents nature and growth which is what the app is all about, however I will need a secondary and third colour to compliment this. 

I decided to look at the colour wheel to see what colours go with green in terms of complementary colours and saw it was the warmer colours such as red, yellow and orange. Green and red compliment each other however that combination wouldn't work as everyone's mind would go to Christmas. With this in mind I believe a pink shade would work well as they are still on opposite sides of the wheel and it is also relevant to flowers and plants in real life - a lot are pink and if someone was asked to draw a flower likelihood is there would be pink petals.

I am going to find 2 pantone colours that compliment each other, green and pink pale in shade as they will go together better and look a lot more sophisticated than bright green and pink. 

App Name

• My Garden
• Plant Finder
• Bloom Time
• Flower Power
• Identify that flower!
• Plant That

I have to consider what purposes of the app are and which order of importance they hold:

1. To provide information on plants and help you take care of your own
2. To scan/search and discover new plants
3. To interact with other users who have a passion for plants

With this list in mind I think the most relevant name would be 'My Garden' as it primarily is about looking after your own plants rather than being branded as a social or plant finder, although it does have these added extras. 

App Logo

I am going to keep it simple and create a small flower/plant illustration using the primary colour scheme.

SB2 Digital Wireframes

I developed the wireframes that I initially sketched on paper with Adobe XD so that I could start to get a feel for the dimensions i'm working with as well as starting to develop a hierarchy using greyscale figuring out what components need to stand out. Using the same font throughout and varying the point size lets me see if the differences are suitable. I am using this draft to figure out the order and navigation of the app and will consider the size of objects/font etc once I have started to develop with a direct comparison blog. 

These three art boards show the log in process from when you first click on the app. The first page you land on will show the app logo and give you two options: log in or register for first time users; the reason a log in is essential is so that profiles can be logged into on other devices and 'my garden' and 'social' areas be saved. Adding a 'login/register with Facebook' integration allows the social section to be linked with your Facebook, as well as the login process being quicker if you don't want to manually enter your name, username, email and password. Having said this I will have to add another page that allows you to choose your username after verifying with Facebook. 

There are 4 main sections in the app - scan, my plants, search and social. The scan and search pages you can see above are the features you use to identify and add plants to your own space. Social will take you to the profile that has been created when you choose a username. Scan and search will both take you to the possible matches page below. 

From the possible matches page you would click on result to take you to the plant profile page which features the information, an option to add to garden and related plants. When you add to garden it would update instantly and take you to that space. If you click on a related plant the same style plant profile would appear with the same option to add to garden. 

Above you can see what the standard list would look like for the plants you've added to your personal plant section - similar to the search result page if you click on one you will be taken to the plant profile. The page next to it is your schedule for care I am going to add symbols to represent watering, spraying and cutting down etc. Below are the pages that feature in the social section of the app - your own profile, a newsfeed and an explore page that can be used to search for other users, plants as well as bringing up random posts you may be interested in. 

One big thing I need to establish is how the app will actually be navigated around as I haven't given any buttons to go from page to page or a side bar for navigation or to hop from area to area. I also need to add another page for what the search results would look like from the explore page (social) and alter the plant profile to show photographs that people have posted and tagged that plant in. Aside from this I have all of the pages that I need to include for the app to work, the next step is to add visual design and work on prototyping it. I am also going to collect information and photographs that I can use to show example of how the app would work such as for the plant profile. I have decided to scrap the 'add to my garden' and replace it with add to my plants as it is slightly misleading and confusing using two different phrases.

Above I changed the add to my garden to plants so that it is more coherent with the rest of the app. I also added pages for the explore tags of plants as well as the results page for explore social. Below is a first draft of a bar that could feature at the bottom of all the pages to allow navigation throughout the app. From left to right:  back button, home button (takes you to 4 sections) search (takes you to scan/search page) leaf button (takes you to your plants) and the circle takes you to social profile.