The Design Process:
Design for screen is the same process as print. I need to focus on evoking an emotional response rather than just for aesthetics.
RESEARCH
- Page Impressions - a request to load a single page of an internet site.
- Unique Users - the number of individual users to a site over a defined period, often a month.
- User Flows - a diagram showing a user's journey, used to show most likely user experience.
- Personas - fictitious characters that are created to represent the different user types within a targeted demographic that might use a sight or product.
- Use Cases - a description of a system's behaviour as it responds to a request that originates from outside of that system.
- One-on-one - person to person interviews
- Focus groups
- SWOT Analysis (Strengths, Weaknesses, Opportunities and Threats.
- Questionnaires
- Market Segmentation - groups of people/organisations sharing one or more characteristics that cause them to have similar product needs. E.g. location, age, gender, or socioeconomic.
WHO - specific target audience
Individuals:
- What is the age range?
- Will your interface appeal more to men or woman?
- Is the interface specific to a country?
- Are the TA based in urban or rural areas?
- What is the average income of your TA?
- What is their occupation?
- How often do they use interfaces?
- What devices do they use?
Companies:
- What is the size of the company?
- What is the position of the people within?
- Will users be using the site for themselves?
- How large is the budget?
Invent fictional personas.
WHY - why are / would users visit your interface
Motivations:
- Are users looking for general info or specific to achieve a goal.
- If there is a specific goal are they personal or professional?
- Is time on an interface seen as essential or a luxury
Goals:
- Do they want general info/research or are they after something specific
- Are they already familiar with the service or product or do they need to be introduced to it?
- Are they looking for time sensitive information, such as news or updates on a topic?
- Do they need specific information about a product or service to help them decide whether or not to buy/engage with it?
WHAT - what info do your users need and in what order to achieve their goals quickly and effectively.
- Will users be familiar with the subject or brand or do they need to be introduced to it?
- Will users be familiar with the product/service/info I am covering or do they need background info.
- What are the most important features of what you are offering
- What is special about what you offer that differentiates you from competitors
- How often will people engage with your interface
IDEA GENERATION
- Mark-making and sketchbooks
- Mood Boards
- Mind Maps
- Idea Sessions
SOLUTIONS
- Lo Fi - sketches, cheap and quick
- Test and Iterate
- Design Comps
PRODUCTION
Site Maps - a diagram of info that shows the links within the interface.
Wireframes - a simple sketch of key info that needs to go on each page of an interface - hierachy of info - structure for the design phase.
If I follow through this design process I should be able to produce a well informed interface design.
Sketches:
Based on what had stuck out for me within the book I started to sketch out some visual representations. Im going to pick the ideas I like the most and develop them and produce different outcomes from the one original idea.
Ideas:
As I need to come up with 3 distinct solutions for my problem I decided to start doing a mind map of ideas relating to my problem to help me better identify a solution.
1. Social website - A community of cooking enthusiasts and bloggers who are able to give on hand help, they can suggest meals with the ingredients you have available.
2. Every day cooking appliance - A device which you can make shopping lists on, it knows and keeps track of food. Built in cookbook as it connects to the web, changes due to ingredients you have in. Voice commands.
3. App - that uses filters and tags to give you the best suited recipe with the ingredients you have available.
Coding Introduction:
After having a brief introduction into coding it seems like something that I would possibly be interested in learning further about. I think it would be a valuable skill that would help me in my career. However I won't focus on coding until the summer because I don't want to get distracted, as it is a big thing to start learning.
Languages:
- HTML - Hyper Text Markup Language
- CSS - Cascading Style Sheets
- Java - Android language
- Javascript - Advanced effects and added interactivity
- SQL - Database language
- PHP - Sever based language
- iOS - Apple language
- Ruby - Twitter
You are designing for web browsers - html
And devices - orientation - responsive web design
Hamburger icon - good practice? - compact display - hides icons
Critique things and work out whats the best way of working.
Retina screens are almost print resolution - increased loading times.
2.6 seconds a user decides whether to stay on a web page.
The internet is changing and evolving.
Accessibility - screen readers are programs that read out the content of the computer screen to a user. Laws have been passed that require websites to be accessible to those with disabilities.
Images aren't really searchable by type.
Google fonts - font face kit - for websites
If you install a typeface anyone can get access to it.
Licence fees for online distribution so much higher than print.
Look for royalty-free for web.
HTML divides each element of a webpage within an open and close tag. Tags act like containers. They tell you something about the information what lies between the opening and closing tags.
Opening tag:
<p>
Closing tag:
</p>
4 elements that need to be included:
<html>
<head>
<title>
<body>
Coding should be learnt at your own pace.
Don't rely on WYSIWYG (what you see is what you get) applications.
<html> - tells browser what we're doing
<head> - nothing here is visible, it's the functionality, metatags - search engines use it, keywords.
<title> - visible, but not within design
website
</title>
</head>
close tags
</body> - anything is visible
Hello, level 05 BAGD, best year on graphics!
</body>
</html>
The title has to be in the head elements.
In textedit - format plain text
Homepage is called index.html
You have to buy space on a hard drive in a server system.
Coding isn't visual so may be hard for a creative to learn.
Further research I could access code cademy.
After Effects Workshop 3:
After having my 3rd after effects induction I feel a lot more confident with the program although there is still lot's to learn.
Notes:
Layer - transform - auto-orientate
Right click key frame - Toggle hold key frame
Copy = cmd c
Paste = cmd v
Toggle switches / modes
Parent - moves them together
File - dependencies - collect files
Composition - add to render queue lossless - format options
The Briefs: 2016-17 YCN Student Awards:
YCN have got some really interesting briefs, I want to choose one that I think will aid my practice and be something that I am interested in. This will help me when designing as I will be more involved in the project and I will benefit a lot from it.
Briefs that I am interested in:
BEAR
To create our next set of yoyo cards, whisking kids off on a magical adventure with BEAR.
I think that this could be a really fun brief and encourage me to be fun and playful with the designs. I also think that I will enjoy designing something for a young target audience. I really can connect with the ethos of the brand being healthy and educational in a fun way.
GREENALL'S GIN
We would like you to choose quintessential British moments that have lasted through time and are still relevant today, and bring this to life in a contemporary way through a piece of creative that has Greenall’s at its heart.
This brief is quite open ended which let's me play around with what I could produce.
THE GROWN UP CHOCOLATE COMPANY
Create an original and inventive packaging design for a new personalised chocolate product.
I think this brief would be perfect for me as I have an interest in packaging design, it will allow me to be creative and ambitious with design. As well as the packaging they want a landing page online. This is unfamiliar territory but by exploring it I will be able to gain a better understanding of web design, however this side of it does put my off the brief.
Context:
After looking into the key points and what the book is about I want to look into the background of the writer himself to see if this can help aid my design. I also want to look at the period of time that the murders happened in to see whether that will impact my style.
In Cold Blood was first published in January 1966, detailing the 1959 murders.
Truman Capote:
An American professional writer from Louisiana, he began making waves with his debut novel Other Voices, Other Rooms. His novella Breakfast at Tiffany’s (1958) was adapted into a popular film, and his book In Cold Blood (1966) was a pioneering form of narrative non-fiction. Capote spent his later years pursuing celebrity and struggled with drug addiction. He died in 1984 in Los Angeles, California.
While researching and interviewing people for In Cold Blood, Truman, with his flamboyant personality and style, had a hard time initially getting himself into his subjects' good graces. He worked with his friend Harper Lee to write about the impact of the murder of 4 members of the Clutter family on their small farming community. Lee and Capote managed to interview the suspects of the murder. Hickock and Smith hoped that Capote would help them escape the hangman's noose and were upset to hear that the book's title was In Cold Blood, which indicated that the murders had been premeditated.
In Cold Blood became a huge hit, both critically and commercially. Capote used a number of techniques usually found in fiction to bring this true story to life for his readers. It was first serialised in The New Yorker in four issues with readers anxiously awaiting each gripping instalment. When it was published as a book, In Cold Blood was an instant best-seller.
Capote had however been affected by the journey that In Cold Blood had taken him on, and he was never the same, psychologically and physically. He turned to substance abuse to calm his nerves.
(http://www.biography.com/people/truman-capote-9237547#in-cold-blood)
Historical Events in 1960's America:
- The Great Society (John F Kennedy)
- The war in Vietnam
- The fight for civil rights
- The radical 60's
- Post-war economic boom
Holcomb Kansas:
Small farming town with a close knit community.
Psychedelic 60's:
The psychedelic movement began in the mid 1960’s and had an effect, not just on music, but also on many aspects of popular culture. This included style of dress, language and the way people spoke, art, literature and philosophy.
The name “psychedelic” refers to drugs that were popular with the youth culture of the time. The visual motifs of psychedelic art include Art Nouveau-inspired curvilinear shapes, illegible hand-drawn type, and intense optical colour vibration inspired by the pop art movement.
Op art, short for Optical art, is a style of abstraction that relies on geometric shapes, lines, and colour juxtapositions to create optical illusions for the viewer. Gaining popularity in the 1960s, such art often features patterns, grids, and effects like curving or diminishing objects. The Op art movement was driven by artists who were interested in investigating various perceptual effects.
Pop art and pop culture refers to the products of the mass media evolving in the late 1950s and 60s and also to the works of art that draw upon popular culture: packaging, television, advertisements, comic books, the cinema. Pop art attempted to break down the barriers between high (old-fashioned) art and contemporary culture.
(https://visualartsdepartment.wordpress.com/psychedelic-60s/)
Key Points:
I want to look at the plot summary and key points / themes, this will help me to gain a better understanding and come up with more informed designs.
'The chilling true crime 'non-fiction novel' that made Truman Capote's name, In Cold Blood is a seminal work of modern prose, a remarkable synthesis of journalistic skill and powerfully evocative narrative published in Penguin Modern Classics.
Controversial and compelling, In Cold Blood reconstructs the murder in 1959 of a Kansas farmer, his wife and both their children. Truman Capote's comprehensive study of the killings and subsequent investigation explores the circumstances surrounding this terrible crime and the effect it had on those involved. At the centre of his study are the amoral young killers Perry Smith and Dick Hickcock, who, vividly drawn by Capote, are shown to be reprehensible yet entirely and frighteningly human.'
Amazon:
(https://www.amazon.co.uk/dp/0141182571?_encoding=UTF8&isInIframe=0&n=266239&ref_=dp_proddesc_0&s=books&showDetailProductDesc=1#product-description_feature_div)
Book Summary:
- True story
- Murder of the Clutter family in Holcomb, Kansas, in November 1959
- Written like a novel - "New Journalism" - but it is nonfiction
- Deemed masterwork of the genre
- Originally published in four parts in The New Yorker and then released as a novel in 1965.
- Took 6 years to research and write - took toll on Capote, never published another book, In Cold Blood said to be his undoing.
- No apparent motive for killing by Dick Hickock and Perry Smith.
- Family bound and shot to death, with only small items missing from the home.
- Capote read about the crime in The New York Times and before the killers were caught began doing extensive research with the help of his friend Harper Lee, who wrote To Kill a Mockingbird.
- Perry and Dick initially got away with the murder leaving barely any clues and having no personal connection with the murdered family.
- Capote explores the motive - eventually concluding that any real motives lay with Perry - his feelings of inadequacy, his ambiguous sexuality, and his anger at the world and at his family because of his bad childhood.
- Dick plays the role of true outlaw - the impact of the killings weighs heavily on him and his role in the murders remains unexplained and unclear.
- Townspeople of Holcomb and other friends of the Clutters are deeply affected by the murders. Including Nancy's best friend, Sue, and Nancy's boyfriend, Bobby.
- Perceived as the "least likely" in the world to be murdered.
- The townspeople unable to conceive the killers were strangers, many became suspicious of everyone and anxious about their own safety with their neighbours.
- Al Dewey his heads the investigation becomes obsessed with both the murderes and the Clutter family - driving force in life.
- Anxiety in Holcomb grows - killers move on with their lives.
- Perry and Dick go to Mexico and back - seems they might not ever be brought to justice.
- A living witness who can tie the two men to the Clutters, footprints at the crime scene, and the possession of a pair of binoculars and a radio from the Clutter home become the pair's undoing.
- Arrested and both confess
- Tried and convicted for murder - after many years on death row, both men are hanged.
- While on death row, Perry slowly reveals his personal thoughts, his ambitions, and the motives that contributed to his life choices, including the night he and Dick entered the Clutter home.
(https://www.cliffsnotes.com/literature/i/in-cold-blood/book-summary)
I began making a mind map mainly focusing on the characters involved, this then allowed me to highlight certain things that I could potentially work with in the design.
Things that stick out to me:
- November
- 1959
- Eyewitness accounts
- Bloodthirsty
- Idyllic country life
- "four shot gun blasts that, all told, ended six lives"
- Echoing
- The murders, themselves, are not detailed
- Goal of narration - clear and direct illustration of events
- Holcomb impact - fear, paranoia
- Perry's dream
- Footprints - diamond shaped shoe pattern
- Radio and binoculars taken
- Positioning of bodies
- Tension
- Anxiety
- Obsession
- Intimate nature of crime
- Unravelling
- Humanity
- Sale of Babe, Nancy's horse
- "deep underwater"
In Cold Blood: A True Account of a Multiple Murder and Its Consequences by Truman Capote
I have chosen to design the cover for 'In Cold Blood' particularly because it's a book that I would want to read myself and has been likened to a thriller, which is my favourite genre. I think that I will be able to connect and get more involved with this book and hopefully portray something interesting on the cover.
The first thing that I want to do is try and read the book to get a better understanding of the message and what it is trying to communicate, as I think this could aid the design. If I don't read the whole book I want to at the very least read summaries and plot themes etc.
I think that it will also be beneficial to look at previous cover designs for this book as I want to try and use this to come up with something unique and engaging.
Classic cover designs:
Within these examples type is played around with quite experimentally colours are also stark with the black, white, red and orange, or muted to reflect age. Within all of these designs it is clear that the book is a crime book and something to do with history and murder, presented in quite a chilling way. Old photos and newspaper style type are used as well, so this is something I might want to avoid or see if I can use it in a different way.
Cookbooks:
I thought that looking at successful cookbooks could aid me with the content and the design inspiration. Looking at student cookbooks will be more beneficial as this is the area that I would like to target.
Nosh:
This book provides photos with every recipe allowing you to see whether you want to cook it, and what it's meant to look like. The book takes a straight forward and simple approach to cooking. The book is also affordable making it more accessible to students on a budget. There are sections at the start of the book about how long things can be stored for, cooking times for different vegetables, how to cook pasta, how to cook rice, and other handy advice (like 'wash up now and then!'). This book is also extremely good for vegetarians, as lots of the recipes have vegetarian option. It also includes sample menus and shopping lists. It is clearly labeled with how easy it is to prepare, price, time, and for how many people. The layout is clear and easy to read helping reflect the easy nature, bright colours are used to help engage.
Good Food Easy Student Dinners:
A small and affordable cookbook with sections on Brainy Breakfasts and Healthy Snacks, Express meals, Dinners for One, One pan wonders, Food for friends, and Easy puds, there are recipes for every occasion. Recipes are simple to make, they are split up into two or three stages, and so even the most basic beginner can follow them, and opposite the recipe is a clear picture of the finished food, so you know what your making and what your aiming for. The lay out again is clear and easy to follow with good photographs to go along with it. However some of the recipes are overcomplicated and are a lot of hassle to find the ingredients.
The Hungry Student Cookbook 200+ Quick and Simple Recipes:
Not only does it give you more that 200 recipes that are quick, cheap and tasty, but there are also indispensable tips on everything the new student needs to know, from barbecuing tips and drinking games, to how to tackle those tricky household chores. Each recipe has a cost breakdown to help with budgeting and detailed instructions to make them accessible to even the most novice cook. While Eat Healthy contains full nutritional information to prep your body and brain for intensive studying. Although the recipes are quite complex with a large number of ingredients, many of which are fresh, preparation times too are quite long.
Looking at these cookbooks has given me a better idea of how things need to be clearly laid out and the strong focus on ease, affordability and time. Categories within these books are important to help guide people through the book, this is something I will need to consider when working on screen.
App Competitors:
As my idea is based around cooking I want to look at current cooking apps that are on the market, what they do and what I can do that's different to make mine stand out.
BigOven:
This app has a large amount of recipes and the ability to add snapshots of your own recipes, the option to create a grocery list based on recipes you would like to create, and help meal planning with a weekly organiser. The app also adds a social feature where you can check what friends, family and bloggers are cooking. It also has seasonal collections from the home screen which help it to stay updated with the times. There is also a feature which uses up leftovers.
The design of the app works with a white background and grey text, red is used to highlight certain selections and for headings. Images are in a square format which helps to keep it organised and usually quite large scale.
US $1.99 per month or $19.99 per year.
IOS and Android.
Yummly:
Within this app it provides a really good search engine for recipes as well as being able to tailor searches to fit your specific needs and lifestyle. The app starts to adapt and recognise what you like and don't like. You can save recipes and add the needed ingredients to an in app shopping list. Yummly has Instacart built-in, allowing you to use that shopping list to shop on Instacart, then order those items, and, depending on where you live, have them delivered within the hour (US).
Free.
IOS and Android.
Allrecipes Dinner Spinner:
A big wealth of recipes from over 30 million users, extending to photos, reviews and ratings which gives it more of a social feel. You’re able to see what ingredients are on sale and what recipes are the cheapest to make on any given day. The app will also recommend recipes when you walk into certain stores, which could come in handy if you’re in the mood to make something special, but don’t really know what yet. Aside from all of that, Allrecipes comes with all the usual features, like the ability to create shopping lists, save your favourite recipes, and filter your search results by diet, cooking time, and foods you don’t like.
Free, but in-app purchases.
IOS and Android.
Epicurious:
Heralded as a flagship cooking app from when it was first created, with more than 30,000 tested and member-rated recipes within a beautiful, streamlined interface. It allows you to manage shopping lists and recipes across platforms, and even perform voice activated commands that are specifically designed for hands-free cooking. It has a smart kitchen timer and a seasonal ingredients finder.
Free.
IOS.
SideChef:
Access to a wide range of recipes and follow top food bloggers and chefs. The main aim is to make cooking easier for new cooks. Each recipe comes with step-by-step instructions and an accompanying set of photos, videos, voice commands, and timers. You can also adjust the serving size of a recipe, which automatically converts the ingredients. Very sleek and modern looking design.
Free.
IOS and Android.
Looking at the current apps out there for food, there doesn't seem to be an app that focuses on ingredients you already have. I think this will be the most unique aspect about my idea, as it is tailored to help use up what you've got.
Feedback on my problem:
I received really positive feedback for my idea with people saying that it would be something they would definitely benefit from, and they can relate to the problem. They said that it is good because it doesn't deal with a specific target audience, it is something that can be used by everyone that faces this problem. Therefore I need to focus on affordability, accessibility and communication.
It was suggested to include categories for types of people such as students, family etc. and filters for things like budget. Reminders of items that go out of date would also be useful with notifications. I could also create a shopping list on the app so that it can already make suggestions on meals.
The feedback was positive because it teaches resourcefulness and helps people to waste less and learn new skills cooking. We also talked through it possibly becoming an everyday appliance that could sit on your kitchen counter. I know that I am heading in the right direction with my idea so I just need to keep working on it.
My Brief:
Problem:
Having ingredients in your cupboards but not knowing what you can make with them.
Objective/Aims:
- Aiding people with cooking, shopping and saving money
- Being clear and concise with design
- Accessibility
- Gain a clear understanding of the production process for designing on screen
- Fun and engaging
- Affordable
- Easy to use and navigate
- Maximising the potential of digital devices
- Communication is key
Target Audience:
Primarily for students to help reduce waste and cut down costs but it could also be used by anyone, from families to people living alone.
Deliverables:
- Blog
- Detailed wireframes/prototypes and mockups
- Where possible working/animated/navigable prototypes
- Design boards and blog posts, which articulate a thorough and informed approach to the brief. These must include; clearly written/interpreted brief, research, idea generation, development, and production.
