OUGD504 - Design for Screen - Cross Device Example / Design Extension

Here evidences the Style Library Visualiser app's potential for translation across other platforms, the iPad in this particular instance. By simply introducing an additional column to the existing visual language layout, the design shows the apps prospects for usage on a larger scale format whilst maintaining the integrity of the original iPhone application and Style Library webpage from which influence has been derived. Although only a limited glimpse into the alternative formatting of the Style Library Visualiser app for iPad, it is clear to see how the pages would evolve in this point of delivery. 

The image below provides a visual representation for the full optimisation of Style Library as a multifaceted, cross-device formatted utility for use by the target. With multiple tools and points of access at their disposal, the app's original objective to alleviate the struggles typically faced in the interior design process regarding the planning, selection and purchasing of wallpaper for the home is achieved. 

OUGD504 - Design for Screen - App Journeys

With the Style Library Visualiser App design complete, the 'journeys' below show each and every circumstance/possibility of page interaction to be experienced by the target starting with an overview of the navigational pages, followed by the navigation bar from left to right, and finally the personal account section of the app. These pages document all eventualities that can be experienced by the user when using the app as well as act as a showcase for all pages designed in response to the design for print brief.

Please note: upon opening of the app, the opening screen exhibited immediately below will be visible for 1 second.

OUGD504 - Design for Screen - Colour

The Style Library Visualiser app, in cohesion with its existing visual language, is void of any colour that is not supplied via the use of photography of the interiors and wallpapers is exhibits. This means that excluding white, the app features only three tones/shades, these being exhibited below in addition to their numeric coding:

Left - R: 153 G: 153 B: 153

Middle - R: 153 G: 153 B: 153

Right - R: 255 G: 255 B: 255

OUGD504 - Design for Screen - Symbols & Iconography

The symbols/iconography featured on the Style Library Visualiser App are used to convey particular ideologies through associative imagery to objects and beings. Immediately decipherable, easily understood and recognisable on an international level - regardless of language, culture and identity - these pictograms rely on semiotic recognition. Though in some instances the symbols are accompanied by a typographic label to ensure the user experience is as clear as possible, for the most part the human mind is able to determine and establish an immediate connection with these symbols as a result of familiarity and social/cultural awareness. They enhance the user experience through provision of choice and exploration, allowing the user to navigate subconsciously based on their knowledge of what they are looking for and the mind's established visual associations.

The symbols were taken from website https://thenounproject.com, an online platform to which designers and creatives can upload and share symbols, pictograms and icons to be used within applicable design formats. This website for 'Creating, Sharing and Celebrating the World's Visual Language' allows designers to download and use the symbols so long as either royalties are paid to the creator or the creator's work is clearly credited - especially in terms of commercial development of the app.

Once downloaded the symbols were subtly edited to achieve a more consistent stroke/weight of line whilst keeping the integrity of the creator's original artwork.

Below are the original files and artist credits:

OUGD504 - Design for Screen - Style Library Visualiser App Design

Having designed all the pages required in order to produce a seemingly fully functional/working prototype - at which stage commercially it would be passed on to a developer to be produced - I have created an engaging iPhone app that relieves and aids the interior design process regarding the planning, selection and purchasing of wallpaper for the home using augmented reality technology to allow consumers to confidently identify and purchase a wall covering(s) from one of the Library's renowned brands.The app allows the consumer to undertake this process with enjoyment and ease as they immerse themselves in the brands that provide to the Style Library and the wall coverings they sell. 

The app, which allows consumers to buy with confidence and assurance that their interior decisions will be met with satisfaction and gratification, follows the visual language established on the original desktop site of the Style Library which is clean, clear, well structured and suitably stylish - reflecting the sites content/context as 'the premier destination for Stylish and Quality British Design.' 

The apps primary content is framed by two bars: a brand mark bar at the top and a navigational bar at the bottom, both of which hold permanency due to their locked positions which enhance the user experience through complete ease of use and assured functionality of app exploration. The 'Style Library' word mark is featured left aligned in the bar at the top of the composition on any given page of the app in keeping with the suspected brand guidelines of Style Library. 

Using a limited colour palette of white and tones/shades of grey for the navigational visual information of the app, the design allows for focus to be given to the beautifully designed wall coverings created by the Library's contributing brands and the spectrum of colour they themselves provide. The navigational system of the app has been designed to ensure focus is on the products of the Style Library - being the primary purpose and feature of the app - to inspire, showcase and sell wallpaper.

Almost all typographic headings featured within the app are set in upper-case Arial, reflecting the Style Library's position in its sector of premier quality wallpapers from leading British interior brands while creating cohesion and consistency with the original desktop site. Featuring type at 3 sizes consistently throughout the app page design, these sizes being 12pt, 20pt and 30 pt, all typographic information set at scale appropriate to design for screen. Where appropriate, type has been set as standard with capitals only at the start of words for ease of readability of the smaller type size and for a less dominating tone of voice where un-required.

From here, the apps user experience will be enhanced via transitional animation.

OUGD503 - Responsive - YCN: UK Greetings - Development - Biscuit Foiling

Previous suggestions provided from critique advised that tactility of the cards was important in creating a collection of cards and should be emphasised through texture, embossing and/or foiling. 

Foiling as a finish immediately provides printed matter with the perception of luxury as a result of the semiotic field regarding the material and its imitation of precious metals. With a market value up to a value of £1.7 billion (2016), the greeting card industry is of a competitive nature and therefore new greetings collections being brought to market need to have the ability to stand out and create appeal. By creating a collection that features more luxuriously crafted products, consumers are more likely to make a purchase as they feel they are paying for quality that is superior to other options available on the market. 

Initial foiling of each biscuit featured only one tone through a single layer of gold foil, with detailing and information left as space within the biscuit shapes. This initial approach provided results that looked simplistic, and ‘lacking of something’ according to feedback received in critique. 

Following this, a more experimental approach was taken to the foiling process - using layering of multiple tones of foil to differentiate visual information. Foiling layers range from 2-3 and include Gold, Rose gold, Light Pink and Red dependant on biscuit detail and required colour(s).

This approach produced results with a fuller, more captivating aesthetic with visual interest as a result of the combination of metallic tones. 

OUGD504 - Design for Screen - Critique with Matt from Only Studio

Today Matt and Greg from Leeds-Based studio Only came in to stand in on the day's critiques, proving professional advice and suggestion on how to go forwards with design for screen 

I presented my designs of the app pages thus far and the concept behind the app to Matt and a small group of peers.

The overarching feedback that I received was that so far the app appeared stylish, well structured and clean, successfully evidencing influence from the visual language of the original Style Library site.

Matt said he really liked the concept of the app as it was something that he would have thought of but could see a gap in the marked for the augmented reality wallpaper visualiser. The constructive criticism I received was that there needed to be greater contrast/distinction between the selected icon on the navigation bar at the bottom of the screen design in comparison to those that are unselected.

OUGD504 - Design for Screen - Design for Screen Principles

Colour

Where the application of colour to screen based design is concerned, there are multiple options available dependant on the range and accuracy required - these being:

• 5 digit hexadecimal code - '#' followed by 5 digits, being letters and numbers. These are typically web colours.
• 3 digit hexadecimal code - similar to the above however providing a smaller range of colour.
• RBG - Red, green and blue - the values of light a screen uses to create colour. Details of each colour quantity provide colour information. e.g - 100% red = (255, 0, 0) [RGB].
• RGBA - Red, green, blue and alpha channel. More advanced proving opportunity for use of altered opacity/transparency. e.g. 50% opaque red overlay = (255, 0, 0, 0.5)

FACT - Blue is the most commonly used colour on the internet.

Typography

When designing for screen, a point size of 12 is the smallest a designer can use before legibility issues would ensue.

Web/screen safe fonts

The fonts that are most safe to use are:

• Arial / Helvetica
• Times New Roman / Times
• Courier New / Courier

Alternate options that work cross-platform are:

• Palatino
• Garamond
• Bookman
• Avant Garde

Fonts that work exclusively on Windows and MacOS:

• Verdana
• Georgia
• Comic Sans MS
• Trebuchet MS
• Arial Black
• Impact

Grids

For larger screens, Massimo Vignelli and other masters of design say a 12 column grid should be used to create and produce and broad range of layouts while still maintaining consistency.

OUGD503 - Responsive - YCN: UK Greetings - Development - Biscuit Illustrations

British Biscuit Illustrations

Before each of the individual elements of the UK Greetings collection can be created, first the under-pinning visuals need to be created - these being British Biscuits - that can be transferred across the  collection materials. Below are the the biscuit illustrations created for this purpose:

Each biscuit has been created digitally using simple vector shapes and/or detailing for a playful aesthetic that could also easily be translated into individual separations for foiling and embossing shapes - as suggested in concept feedback.

The illustrations bear respective patterns and/or line work to each of the biscuits that allow them to be immediately identifiable by consumers as their favourites through familiarity of visual representation and association. 

To maintain visual simplicity, each biscuit uses only two tones to distinguish shape/detail information, with the exception of the Jammy dodger which features three tones. 

OUGD504 - Design for Screen - The User Experience: Target Viewpoint

When designing the app, the viewpoint of the target audience must be taken on to determine how they go about buying interior wall coverings to ensure that the app provides them with a number of initiatives on how to buy with an enjoyable confident demeanour. The target, although passionate about interiors and most typically acquainted with the brands of the Style Library, are in need of a utility that makes the entirety of the interior design and selection process a joy from start to finish. 

This leads me to think about what the process is from start to finish, determining the following:

1. The target initially look to the app for Inspiration.
2. They then Search for the particulars they have been inspired by.
3.The target find wall coverings they favour, but are unsure of what it would like like in their home - they save the image for reference: Scrapbook.
4. Using the augmented reality feature of the app, the target Visualise the wall covering in their desired room.
5. Happy with the augmented reality result, they add the wall covering to their basket to purchase. 

This is how I anticipate the user experience to progress: Inspire, Search, Scrapbook, Visualise, Basket.

This will be reflected in design and functionality of the Style Library app.

OUGD504 - Design for Screen - Typeface Identification / Analysis

In search of the typeface used by Style Library in attempt to establish and maintain brand cohesion and consistency - I found that the typeface Arial was of a very high likeness, however the brand word mark has increased tracking and decreased vertical scaling. Subtle discrepancies are also identifiable through shaping of the 'S' and tail/leg of the 'R' being straighter and more definite on the word mark.

Despite these differences, both types have an undeniable likeness to one another. In addition to this, Arial is considered as one of the most web/screen safe fonts as a result of its creation as Microsoft's answer to Helvetica, and therefore is undoubtedly appropriate for the use in the Style Library app and is a commercially viable option due to its free cost as a result of its instalment as standard on computers.

OUGD504 - Design for Screen - Style Library Visual Language Analysis

The Style Library desktop website is clean, clear, well structured and suitably stylish - reflecting the sites content/context as 'the premier destination for Stylish and Quality British Design.' The Library is the home of ground-breaking British design from the internationally renowned brands: Sanderson, Morris & Co, Harlequin, Zoffany and Scion. A unique destination to source inspiration and discover the broad spectrum of wall coverings available from these leading British interior brands.

In using a limited colour palette of white and tones/shades of grey for the navigational visual information of the website, the design allows for focus to be given to the beautifully designed wall coverings by the Library's contributing brands and the spectrum of colour they themselves provide. The navigational system of the website has been designed considerately around the strong interior visuals as this ensures the hierarchy is ordered as per importance/purpose of the site - which is to inspire, showcase and sell wallpaper.

The 'Style Library' word mark is always featured left aligned within the composition of any given page of the site, suggesting that this is a part of the brand's guidelines.

All typographic information on the site is set in an upper-case sans-serif typestyle, creating an air of distinction and dominance - perhaps a reflection of the Style Library's position in its sector of premier quality wallpapers from the leading  British interior brands.

Symbols accompany some of the navigational buttons on the site for enhanced visual connotation and representation.

All of the above will be taken into consideration when designing the app to ensure cohesion and consistency of brand integrity is maintained. Where appropriate, the app will follow these guidelines. 

OUGD504 - Design for Screen - Format, Shape/ Size & Resolution

As the Style Library Visualiser app will be designed for screen, that of an iPhone in particular, the format, shape and size will be that of an iPhone screen - this being: 750 x 1334 pixels at a screen resolution of 72ppi. Although the iPhone could take a greater resolution as a result of its retina display, the app will be designed at 72ppi for fasting loading times.

OUGD504 - Design for Screen - Style Library Visualiser App Concept Manifesto

The process of choosing a wallpaper for the home interior may initially seem a painless task, however following copious sample orders that arrive showing only a snippet of the full pattern, working out the required number of rolls considering wall dimensions, fireplaces, doors and/or windows and being unable to truly appreciate the impact of a wall covering design at the proposed scale or expanse in a space — the process can easily become tedious. These considerations and limitations do not allow consumers to buy with confidence and assurance that their interior decisions will be met with satisfaction and gratification.

Style Library - The Premier Destination for Stylish and Quality British Design. The Library is the home of ground-breaking British design from the internationally renowned brands: Sanderson, Morris & Co, Harlequin, Zoffany and Scion. A unique destination to source inspiration and discover the broad spectrum of fabrics, wall coverings and trimmings from these leading British interior brands.

Create and design an engaging Style Library Visualiser iPhone app that relieves and aids the interior design process regarding the planning, selection and purchasing of wallpaper for the home using augmented reality technology to allow consumers to confidently identify and purchase a wall covering(s) from one of the Library's renowned brands.The app should allow the consumer to undertake this process with enjoyment and ease as they immerse themselves in the brands that provide to the Style Library and the wall coverings they sell. The primary function of the app should aim to resolve the most common limitations consumers are faced with when undertaking decorative challenges — such as selection and calculation.

The target audience are those with a passion for interiors, with a particular interest in British design and decor, who are looking to or planning to decorate their walls with a wall covering available from one of the renowned brands featured within the Style Library. With an age range of 25 - 60 — ranging from the age of first time buyers / young working professionals to older persons more acquainted with the brands — the target will be confident in engagement with digital screen based platforms, such as the iPhone. These individuals will have financial stability and therefore will be able to afford and accept the prices of the leading renowned British brands of the Style library. The library provides a diverse range of styles so while this target are not exclusively drawn to one particular aesthetic, they will be cultured in design and interior fashion.

The app, alongside its primary function to visualise using augmented reality, should also let the wall coverings available to purchase from Style Library be the focus of the design; The navigational system should be experienced naturally, subconsciously even as the user experiences the utility guided by instinct rather than heavy overbearing menus, bars and buttons that take away from the brands' designs.

Design of the app should form cohesion with the website and Style Library visual identity as a whole to guarantee brand familiarity and established connection.

OUGD504 - Design for Screen - Design for Screen Critique

Below are the two distinct screen-based concepts devised to relieve and resolve the problems faced relating to interior wall covering selection, sampling and confident purchasing.

• Concept One - To create and design an engaging Style Library Visualiser iPhone app that relieves and aids the interior design process regarding the planning, selection and purchasing of wallpaper for the home using augmented reality technology to allow consumers to confidently identify and purchase a wall covering(s) from one of the Library's renowned brands.The app would allow the consumer to undertake the process with enjoyment and ease as they immerse themselves in the brands that provide to the Style Library and the wall coverings they sell. The primary function of the app is to resolve the most common limitations consumers are faced with when undertaking decorative challenges — such as selection and calculation - through live image capture of they augmented reality they create with the tap of the screen. 

• Concept Two - To create and design an engaging virtual reality head-set screen that relieves and aids the interior design process regarding the planning, selection and purchasing of wallpaper for the home using virtual reality to allow the consumer to see their interior dreams come to reality through immersion into computer-generated recreations of their home decorated with Style Library wall coverings. This screen design will enhance the targets ability to confidently and easily choose a wall covering as a result of the virtual reality head set allowing them to experience the interiors firsthand through authenticated user experience and reflection. 

• Target Audience Consideration - The target audience are those with a passion for interiors, with a particular interest in British design and decor, who are looking to or planning to decorate their walls with a wall covering available from one of the renowned brands featured within the Style Library. With an age range of 25 - 60 — ranging from the age of first time buyers / young working professionals to older persons more acquainted with the brands — the target will be confident in engagement with digital screen based platforms. These individuals will have financial stability and therefore will be able to afford and accept the prices of the leading renowned British brands of the Style library. The library provides a diverse range of styles so while this target are not exclusively drawn to one particular aesthetic, they will be cultured in design and interior fashion.

Question

Which concept do you believe provides a more effective resolution to the problem and why?

Response

• Concept One, the app is much more accessible and would also be a great tool.
• The app - having everything to do with the process in one place would shorten the time consuming process of shopping for wallpaper.
• Concept one is an engaging concept and suitable solution to the problem. This would be something my mum would like to use.
• I like the idea of number two but feel it would not be appropriate to the older end of your target audience. I think they would feel uncomfortable, so concept one.
• Concept two sounds more interesting.
• Concept one is more commercially viable and believable.
• I think the augmented reality app would be a really nice project.
• Concept two is more engaging but less target-appropriate. 
• Definitely the app.
• I would love to use the app!
• Two.
• Concept number two sounds far too advanced for your target.

Reflection

Although there was no unanimous response to the question, the clear majority winner is concept one. I am happy with this as I too held some of the concerns regarding concept number two being too technologically advanced for the older age range of the target audience. Feedback shows that it is believed that an augmented reality visualiser app will be engaging, more accessible, commercially viable as a project and a greater solution to the problem.

OUGD503 - Responsive - YCN: UK Greetings - Further Research & Concept / Rationale

British Biscuits

Every year the average British household consumes 103 packets of biscuits.

It wasn’t until the 19th century that the popular emergence of afternoon tea that Britain began to regard biscuits as something to accompany tea. This is a uniquely British notion that was quickly exported around the globe, establishing the stereotype of Britain as a nation of biscuit-lovers and tea-dunkers.

While biscuits were originally made for soldiers and sailors from a simple flour and water mix as means of preserving carbohydrates, biscuits today have far transcended their original purpose, 

resulting in a range of Biscuits considered quintessentially British. 

The interest the British place in Biscuits can undoubtedly be represented by the mass following of BBC programme ‘The Great British Bake-off,’ for which this years final received 14.8 million viewers, making it the most watched programme of the year so far (2016).

Biscuits, alongside Jam and Tea, will be at the heart of Britain’s Brexit trade negotiations.

The Favourites

Custard Creams, Bourbons, Digestives, Jammy Dodgers, Nice Biscuits, Rich Tea, Malted Milks 

and Pink Wafers.

Concept

To take a selection of Britain’s most loved classic biscuits and transform them in to greeting motifs through alteration of the original biscuit design. These biscuits are ingrained in Britain’s culture and social consciousness, meaning their familiarity to consumers will allow for the collection to appeal to the Nation.

Rationale 

In the wake of Brexit and its ongoing supply of discomfort, Britain is in need of some positivity and a reminder of what we have in common - not our differences. The British biscuit provides a relevant set of visual motifs that both reinforce and establish the notion of quintessential British custom(s) and their un-wavering social presence. Both the sending/displaying of greeting cards and the consumption

/notion of British biscuits come together to successfully and indefinitely reflect British society. Using these as the foundation to form and create a collection/range of greeting material/stationary I hope to capture the traditionalist notions of the UK public to engage and connect with them emotionally and visually.

OUGD503 - Responsive - YCN: UK Greetings - Concepts Critique/Feedback

Following generation of 3 potential concepts for the UK Greetings brief, today these were taken to critique. The feedback attained follows:

• 'Such a fun idea and very relevant to your target audience! Consider embossing/textured paper to make biscuits more realistic!'
• 'Consider texture, touch, how the card will be read etc.'
• 'I feel the idea of natural colours used across the cards with small type would be most effective with the illustrations you have.'
• 'Very clearly British. Gives off a sense of national pride (something that is needed after Brexit).'
• 'Great idea! Sounds effective in many ways. I like the idea of considering texture. Maybe think of the other senses too - e.g. smell etc. ?'
• 'The illustrations look like they will work really well with the cards.'
• 'Really clever idea! Biscuits lend themselves well to having writing on them replaced with greetings, and everyone loves a biscuit. My favourite paper chase cards often involve an element of humour. Biscuit designs would be good embossed into paper. Think about other popular biscuits like party rings, oreos etc.'
• 'A nice idea. I can see it being produced in many ways from monoprint to screen print. I like the idea of having the card to fit the shape of the biscuit as its more unique.'
• 'Living for the variations of biscuit print on one sheet! and the card edges of biscuits has to be done. So much appeal and already built in appreciation from our culture! Worth trying embossing whilst having foil just to catch the attention of the words.'
• 'Try adding puns, as a theme I think this could be carried out amazingly but you need something to bring people back and make them think about their favourite (doesn't have to be humour but that has shown to work).

Almost all feedback suggests concept No.03 is the concept with most potential and is the only concept to have really attracted any response. The feedback received provides clear indication that the British biscuit concept has the most potential and evoked more emotional response than concepts 01 and 02. Key suggestions advise that tactility of the cards is important and should be emphasised through texture, embossing and/or foiling. 

Following this, additional research is required in order to confidently articulate a rationale for the project to be used as a reference throughout the design process to ensure clear aims can be achieved. 

OUGD504 - Design for Screen - Site Map & Wireframing

Following the Style Library app page planning, here is the Style Library App sitemap and Wireframes.

The sitemap shows the apps featured page content. It provides an overview of the interrelationship between app pages and how the user may navigate the app in one clear typographic representation. The sitemap will be used as reference throughout the design process to ensure the user experience is as easy and straightforward as possible, and also in reference to pages that need to be designed.

The wire framing below shows my initial ideas regarding the design layout/composition of the Style Library app pages. Featuring proposed clear, well structured content formatting, I will refer to these wireframes when undertaking the app design as a point of reference.

OUGD504 - Design for Screen - App Pages and Planning

In favour of my first concept, I began to consider and plan what pages would need to be designed in order to produce a seemingly fully functional/working prototype - the stage at which commercially it would be passed on to a developer to produce.

Below are the pages I anticipate I will (potentially) need to design to achieve this:

• Loading Page.
• Inspiration Pages.
• Search by Pages.
• Scrapbook.
• Visualiser.
• Basket.
• Account Page.

Loading Page

Inspiration Pages

• By Style.
• By Room > Bedroom, bathroom, living room, dinging room etc.
• By Colour.

Search by Pages

• By Brand > Harlequin > Results > Refine > Product Information > Roll Calculator.
• By Colour.
• By Style.
• By Type.
• View All.

Scrapbook

• Scrapbook > Image Links.

Visualiser

• Allow access to camera.
• Visualiser (Live Camera).
• Augmented Reality Image. 
• Saved images.

Basket

• Empty Basket.
• Product in Basket.

Account Pages

• Sign in.
• Account Details.
• Order history / Live orders.
• Personal Style Library (saved  augmented reality images)

OUGD504 - Design for Screen - Ideas & Concepts

In creating and designing an engaging screen-based platform for Style Library that relieves and aids the interior design process regarding the planning, selection and purchasing of wallpaper for the home, I have devised two distinct concepts that should allow for the resolution to enable the target to undertake the process with confidence and ease. Both with the primary function of resolving the most common limitations consumers are faced with when undertaking decorative challenges — such as selection and calculation - the two concepts are featured below:

Concept One

To create and design an engaging Style Library Visualiser iPhone app that relieves and aids the interior design process regarding the planning, selection and purchasing of wallpaper for the home using augmented reality technology to allow consumers to confidently identify and purchase a wall covering(s) from one of the Library's renowned brands.The app would allow the consumer to undertake the process with enjoyment and ease as they immerse themselves in the brands that provide to the Style Library and the wall coverings they sell. The primary function of the app is to resolve the most common limitations consumers are faced with when undertaking decorative challenges — such as selection and calculation - through live image capture of they augmented reality they create with the tap of the screen. 

Concept Two

To create and design an engaging virtual reality head-set screen that relieves and aids the interior design process regarding the planning, selection and purchasing of wallpaper for the home using virtual reality to allow the consumer to see their interior dreams come to reality through immersion into computer-generated recreations of their home decorated with Style Library wall coverings. This screen design will enhance the targets ability to confidently and easily choose a wall covering as a result of the virtual reality head set allowing them to experience the interiors firsthand through authenticated user experience and reflection. 

These two distinct concepts will be put to critique to decide which to carry forward.

OUGD503 - Responsive - YCN: UK Greetings Idea Generation

Following my research in to the Greeting card industry, my findings have allowed me to identify the following:

• While online greeting card platforms such as Moonpig or Funky Pigion are in abundance, consumers still hold preference for cards available in stores - which suggests that for many a personalised photo card does not compare to a more crafted card with a higher finish - and this is reflected in sales statistics as well as the act of card making being the number one craft hobby.
• While many trends in occasion and/or sending situation come from America, the act of sending and receival of greeting cards remains quintessentially British.
• With 85% of all cards being bought by women, it would seem there is a gap in the market for a Greetings collection that is more accessible or appealing to men - or both sexes equally. Finding a point of interest that resonates with both men and women alike may provide opportunity for the Greeting card industry to become more neutral in targeted demographic. 

Considering my above findings, I have devised the following concepts:

Concept 01

With 85% of all card sales being made by women, the first concept calls for a more masculine greetings collection to be created for the modern gentleman. Focusing on creating a more refined, classic and timeless aesthetic that contrasts the plethora of overly adorned greeting materials most typically available at present. This collection would aim to place functionality and concept of the resolutions as equal to shelf-appeal, and not above.

Concept 02

A greetings collection consisting of un-defined occasion or sending situation - to encourage the act of writing for writing's sake. In a time where sending a text or snapchat appear to be the only forms common communication socially, this collection would provide a range of materials for more considered written conversation/correspondence and exchange of gifts.

Concept 03

To take a selection of Britain’s most loved classic biscuits and playfully transform them in to greeting motifs through alteration of the original biscuit design, bringing together two British customs: sending cards and eating biscuits. With these biscuits ingrained in Britain’s culture and social consciousness,  their familiarity to consumers will allow for the collection to appeal to both men and women and will target a larger demographic by engaging with them emotionally and visually.


These concepts will be taken to critique to allow for the concept with most potential to be taken forward and developed for the UK Greetings Collection.

OUGD504 - Design for Screen: Identifying Similar Utilities

With developments in virtual and augmented reality technologies reaching the mainstream, the ability to explore, create and envision the capabilities of the digital world in our own surroundings has never been easier. Applications for smartphones and tablets appear to be at the forefront of this rapid emergence in altered reality, such as those featured below:

Dulux Colour Visualizer

The Dulux colour visualiser allows the user to use augmented reality at the tap of a finger to search, shop and save the entire Dulux colour range after applying the colour(s) of their choosing to their own interior and exterior walls live or on an existing photograph. Optimised for both mobile phone and tablet formats, this app provides the user with ability to choose colours with confidence and ease safe in the knowledge that their decision is justified. 

The app uses the brand's print-collateral visual language, including contrasting edged rectangles and bold colour, translated into screen format. Using clear iconography, the user is able to navigate the app seamlessly from the bar at the bottom of the screen. 

Majoritively a simple, clean and clear layout - though at times complex as a result of multiple layering and translucent colour - the app's user experience is easy, enjoyable and above all problem solving. Gone are the days you buy the wrong colour paint. 

DFS Room Planner

The DFS sofa and room planner uses augmented reality to explore how a new sofa would look in their own living room without having to actually buy one. The app allows its user to solve an abundance of problems regarding scale, colour, texture and spacial clarity via virtual representation of interior rooms as well as live imagery augmentation. 

Using a series of pictograms to direct and evoke exploration from the user, the functionality of the app appears clear and distinct. 

The iPad app makes use of the blue and pink colour scheme associated with the brand to highlight the navigation of the app and the users exploration of its pages.With the design bearing three-dimensional style buttons and bars, the app could benefit from a less overbearing 'virtual' aesthetic. The navigation of the app should be experienced naturally, subconsciously even as the user experiences the utility guided by instinct and not heavy menus, bars and buttons.

IKEA Augmented Reality Catalogue

The 2014 IKEA catalogue worked with the IKEA app on smartphones and/or tablets by having its  customers put the catalogue on the floor as a marker and then selecting the product they want to see in that location via the app.The room is shown live on-screen through the camera on the device and then a chosen object can be superimposed as though in-situ.

The app and catalogue combination work together with help from augmented reality to provide customers with the ability to test out the products they’ve seen and been inspired by in the catalogue within in their own homes. Augmented reality offers a way of using mobile technology to enable to product testing - meaning the technology has a practical purpose in helping customers visualise the way their homes could look.

Similarly to the Scandinavian products available from the store, the app appears minimalistic and therefore suggests a utility that is clear and easy to use. 

OUGD504 - Design for Screen - Augmented & Visual Reality Research

Augmented reality and Virtual reality have the ability to allow for users to have experiences and interactions driven by the desire to be immersed in a simulated reality for entertainment, play or to add an additional dimension of interaction between digital devices and the real world. 

What is Augmented Reality?

Augmented reality (AR) is a technology that layers computer-generated enhancements over an existing reality in order to make it more meaningful through the ability to enhance interaction within it and provide accurate visual illusion. This technology is rapidly coming into the mainstream, with augmented reality being developed into mobile devices apps to blend digital components into the real world in such a way that they enhance each other respectively, however distinction can be made between the two. 

Scandinavian Furniture Chain Ikea's Augmented Reality App

What is Virtual Reality?

Virtual reality (VR) is an artificial, computer-generated simulation/recreation of a real life environment or situation, immersing the user by making them feel as though they are experiencing the projected reality firsthand through stimulation of the senses - primarily their vision and hearing. This is most typically achieved by wearing a headset, such as Facebook’s 'Oculus,' equipped with the appropriate technology, and is used prominently in two different ways:

• To create and enhance an imaginary reality for gaming, entertainment, and play (Such as video and computer games, or 3D movies, head mounted display).
• To enhance training for real life environments by creating a simulation of reality where people can practice beforehand (Such as flight simulators for pilots).

Virtual reality is made possible through a coding language known as VRML (Virtual Reality Modeling Language). This coding can be used to create a series of images and the possible interactions associated with them specifically. 

Facebook Oculus VR Head-set.

Augmented Reality vs. Virtual Reality

Augmented reality and virtual reality are inverse reflections of one in another in what each of the technologies seek to achieve and provide the user. Virtual reality offers a digital recreation of a real life setting - while augmented reality delivers virtual elements, such as digital images, graphics, or sensations, as an overlay to the real world.

Point of Delivery

Virtual Reality is most typically delivered to the user through a head-mounted or hand-held controller which connects people to the virtual reality and allows them to control and navigate their actions in an environment meant to simulate the real world or imagined alternate reality.

Augmented reality is being used more and more in mobile devices such as laptops, smart phones, and tablets to change how the real world and digital images, graphics intersect and interact with one another. 

OUGD504: Design for Screen - Coding and Screen Considerations

Languages

When designing for screen, it is important to consider and identify the device being designed for as many have their own coding language that is required in order for the visuals to be displayed correctly. Such languages include the following:

• HTML - Hyper Text Mark-up Language 
• CSS - Cascading Style Sheets
• Java - Android Language
• SQL - Database Language
• PHP - Server Based Language
• iOS - Apple Language
• Ruby - Twitter Langauge
• Java script - Advanced effects & added interactivity/functionality

Designing for Browsers 

Another consideration when designing for screen, websites in this instance, is the browser being used/designed for - these being the software through which we access the internet:

• Google Chrome
• Firefox
• Safari
• Opera 
• Internet Explorer

Further to this consideration is the device being designed for, as some websites may exist across multiple platforms and have device-specific web-pages. These devices include:

• Desktop Computers
• Laptops
• Tablets 
• Mobile Phones
• Televisions

There terminology used for websites that are able to adapt is a 'responsive' website.

In circumstances where entire webpages are condensed visually into smaller device points of delivery, such as large menus, an 'accordion menu' may be used to make greater use of space and order information more relevantly to the device/platform being used for access. This menu, as suggested through its name, features a series of three equally spaced horizontal lines in a column and is used copiously in mobile web and app design.

Resolution

While many people are aware that the optimum resolution for print in 300ppi, fewer are aware of the optimum resolution for screen - this being 72ppi.

Resolutions for retina screens are capable of using more than 72ppi for increased accuracy and definition, however 72ppi remains a strong favourite as a result of its ability to create smaller file sizes which give faster speeds to webpages.

Fast loading webpages are of vital importance in terms of user experience when considering that the amount of time given by a user before leaving a website is just 2.6 seconds.

Designing for Accessibility

Screen readers are programmes that read out the contents of a computer screen to a user. Most commonly used by those with visual impairments, these allow for greater accessibility to those who would otherwise be unable to access information online.

In the same way that many countries have legislations that require public buildings to be accessible to those with disabilities, many laws have also been passed that require websites to be accessible to those with a disability.

Type on Screen

Perviously, web designers needed to use standard fonts (12) as computers used the fonts installed on the computer to display on screen. 

These days, specific fonts can be installed to a website - however a license must be owned to distribute this typeface. Alternatively, a royalty-free typeface can be used. It is illegal to distribute type through any commercial format without the correct permissions. 

Code

HTML code used tags to divide each element of a web-page within an open & close tag. Tags act like containers. They tell you something about the information which lies between the open and close tags. e.g.

<HTML> 

<head>

<title>

<body>

Closed tags are required for each word.

With HTML coding, WYSIWYG...What you see is what you get.

<html> - Tells browser the language that will be used.

<head> - Nothing is visible, added functionality.

<title> 

*title*

</title> 

</head>

With coding, code is also staggered as below:

<html> 

     <head>

          <title> 

          *title*

          </title> 

     </head>

          <body>

          *body type*

          </body>

</html>

The first page of a website must be saved as 'index.html' - After this linked pages can be named anything appropriate to the site and its pages.