Showing posts with label Design for Screen. Show all posts
Showing posts with label Design for Screen. Show all posts

Sunday, January 8, 2017

OUGD504 - Design for Screen - Style Library App Evaluation & Collateral Imagery



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.

The Style Library Visualiser is 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.

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.

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.

The transitional system used by the app uses simple, clean logical direction suggestion that aids the users awareness of interaction within the app.

A straightforward system, users can expect and experience the following transitions during their experience:
  • When moving from left to right across the navigation bar from 'Inspire' to 'Basket' and those in between, pages will 'Push Left.'
  • Upon progressive movement within the app, pages will 'Push Left.' 
  • When returning or going back within the app, pages will 'Push Right.'
  • When moving back from right to left across the navigation bar from 'Inspire' to 'Basket' and those in between, pages will 'Push Right.'
  • In opening the account section of the app from the main app pages accessed via the navigation bar, the page will 'Slide Down.'
  • On return to the main application pages from the account section, the main app pages accessed from the navigation bar  will 'Slide Up.'
  • With the exception of the account pages, roll calculator and visualiser - the navigation bar will remain present at all times for ease of use and enhanced user experience.
  • When jumping between app pages or opening via links, such as from scrapbook image to product information, the transition will 'pop.'
  • In the case of interaction with photo pages featuring a translucent quality/overlay, tapping will 'dissolve' back to the previous screen. 
The app transitions exploit western culture and the subconscious act of reading from left to right and the standard navigational devices encountered on a daily basic (left, right, up, down) to enhance the user experience through familiarity of action and engagement with everyday life - making for an enjoyable experience that comes naturally to the target. Each transition within the app has been considered in its ability to mimic the expectation of the target in predicting their assumption of how things should act in response to their actions. 

The Style Library Visualiser app also holds potential for translation across other platforms, the iPad in particular. 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 has been drafted, it is clear to see how the pages would evolve in this point of delivery.











Friday, January 6, 2017

OUGD504 - Design for Screen - Functionality & Videographic Documentation

The videos showcased on this page show the Style Library Visualiser App's animated functionality, demonstrating the exact user experience. As evident in these videos, the app uses simple, clean transitions between pages that enhance the user experience and engagement through amplified sense of functionality.

The transitional system used by the app uses logical direction suggestion that aids the users awareness of interaction within the app.

A straightforward system, users can expect and experience the following transitions during their experience:
  • When moving from left to right across the navigation bar from 'Inspire' to 'Basket' and those in between, pages will 'Push Left.'
  • Upon progressive movement within the app, pages will 'Push Left.' 
  • When returning or going back within the app, pages will 'Push Right.'
  • When moving back from right to left across the navigation bar from 'Inspire' to 'Basket' and those in between, pages will 'Push Right.'
  • In opening the account section of the app from the main app pages accessed via the navigation bar, the page will 'Slide Down.'
  • On return to the main application pages from the account section, the main app pages accessed from the navigation bar  will 'Slide Up.'
  • With the exception of the account pages, roll calculator and visualiser - the navigation bar will remain present at all times for ease of use and enhanced user experience.
  • When jumping between app pages or opening via links, such as from scrapbook image to product information, the transition will 'pop.'
  • In the case of interaction with photo pages featuring a translucent quality/overlay, tapping will 'dissolve' back to the previous screen. 
The app transitions exploit the western culture and subconscious act of reading from left to right and the standard navigational devices encountered on a daily basic (left, right, up, down) to enhance the user experience through familiarity of action and engagement with everyday life - making for an enjoyable experience that comes naturally to the target. Each transition within the app has been considered in its ability to mimic the expectation of the target in predicting their assumption of how things should act in response to their actions. 

These transitions are exhibited in the following videos:












Thursday, December 22, 2016

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. 



Wednesday, December 21, 2016

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.








Monday, December 19, 2016

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 R153 G153 B153
Right R255 G255 B255

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:





Sunday, December 18, 2016

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.


Tuesday, December 6, 2016

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.

Saturday, December 3, 2016

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. 

Friday, December 2, 2016

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.

Wednesday, November 30, 2016

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)

Monday, November 28, 2016

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.

Tuesday, November 22, 2016

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.