iphone app design + research

7/29/2019 iPhone App Design + Research

1/32

I S L A M I C PAT T E R N S

F O R

B AT H R O O M T I L E S

Islamic Patterns for Bathroom TilesDina Hany, 16-741, 9th SemesterWS 2012/13 Interaction Design and Sign Systems with Jochen Braun


2/32

Dina Hany | Islamic Patterns for Bathroom Tiles32/2

Table of Content

01 Introduction 01

02 Research 06

02.01 Research techniques 06

02.02 Existing Solutions 07

02.03 Scenarios and core problems 08

03 Concept 1203.01 User engagement strategies 12

03.02 Customer analysis 12

03.03 User-story 12

03.04 Use-cases 13

03.05 Wireframes 13

04 Design 14

04.01 Brand Identity System 14

04.02 Interface Image 18

04.03 Visual language 16

05 Final Screen Design 20


3/32

Dina Hany | Islamic Patterns for Bathroom Tiles 3/32


4/32


01.01 Why Patterns?

This project started off as a passion for patterns. I wished to understandwhat was so fascinating about their nature and why they have such a stronguniversal language that resonates with all people. In particular, I was moredrawn to abstract geometrical shapes. The willingness to rstly understand andthen commuinacte this language is what drove the initial part of this project.Afterwards, I chose to focus on 1 family; Islamic Patterns as they are widelyspread and embedded in the history of Egyptian culture. Usually these patternsare rich and complex with star or oral motifs. They carry an air of sophisticationand craftsmanship. Also, since these patterns are considered old and somehow

part of a forgotten heritage, I wished to make these designs as contemporary asthey are accesible.

01.02 If Patterns could Speak

While some patterns carry no message at all and are simply for visual pleasure,others may hold symbolic value. As patterns vary from one culture to another,they carry a different meaning with relation to the attitudes, philosophy andspirituality of their people. In Islamic patterns, for instance, it carries a messageof unity expressed in the diversity of shapes, beauty that is essential for manssurroundings and truth that is expressed in the precision and strictness of the linework. Due to their prestigious air, they are regarded as cryptic decorative motifsin places such as mosques, grand architectural monuments and sacred spaces.My main motication for this project was to nd a way to communicate theseshapes interactively and in an easily accessible way inwhich I may be able torevive and evolve these designs with a modern look and feel. The challenge wasto decipher or in other words, make the communication process less cryptic andmore easy on the eye without reducing or taking away from the pattern.

01 Introduction

01.01 ORIENTAL FLORAL PATTERN


5/32


01.02.01 CLASSIC EXAMPLE OF ISLAMIC PATTERN


6/32


02.01 Research Techniques

Throughout the research, my main focus was to gather as much visualdocumentation as possible. There is plenty of visual data concerning IslamicPatterns in the past. However, research was important inorder to know what isout there interms of contemporary designs related to the same subject inwhichcase there is but a few. The imagery is mainly collected through research overthe Internet and creating an archive of patterns using similar keywords. Somepictures were also scanned from several historical books and contrasted with themore contemporary visual data. By contrasting old and new, I segmented theminto key moodboards depicting each style or family of patterns. Also, there aremoodboards that are not necassarily Islamic but are gathered together due tosimilarities of shape, colour and overall charachter.

collecting visual data

for primary moodboard,

keywords such as:earthy,light & unifed

02 Research

VISUAL RESEARCH

MOODBOARD 02.01


7/32


02.02 Existing Solutions in the Market

Most examples of modernising Islamic pattern were restricted to bright, pop art-like colours. As a culture clash beteween the oriental and occidental, it is as if twostyles ghting to meet yet the result is a visual clash verging on kitsch. However,throught my research I found a recent brand named Drumstick design whichproduces beautiful patterns that are neither strictyly overwhelming in complexitynor colourfully kitsch. The company provides home soloutions for houses on abudget or rented houses. There is more than one line starting with tile stickersand socket covers where the idea was to provide a visual identity to an otherwisewhite space. Each collection is based on a different Egyptian/Islamic design and

the overall concept is to celebrate ones own culture by inviting it into the home orInterior space.

kitsch exaples of

moderns Islamic

pattern design

WALL STICKERS BY DRUMSTICK DESIGNS


8/32


02 Research

02.03 Research Outcome Scenarios & Problems

The rst scenario to analyse was the visual language of Drumstick Designs.Colourful, saturated and strickingly bold, the patterns are repetitive for anoverwhelming visual effect. Although their bold colour and style make them lessclassical to the older Islamic patterns, they somehoew still retained a quality thatstill adhered to tradition. To solve this problem, I gathered more visual data thatdoes not retain to Islamic pattern and collected designed several examples formoodboards that are inspired by Islamic pattern and fused the two inorder tovisualize possible outcomes for a new visual language.

MOODBOARD 02.03.02


9/32


MOODBOARD 02.03.03

02.03.01 DRUMSTICK DESIGN PATTERN


10/32


02 Research

MOODBOARD 02.03.04


11/32


MOODBOARD 02.03.05


12/32


03.01 Concept & User Engagement Strategies

The concept is to create this missing modern look and feel for Islamic patternsthrough engaging the user with their philosophy in an interactive iPhoneapplication where the end outcome is a sticker for blank interior spaces such asbathroom tiles. The main strategy used to compel interms of visual language isthe unusual nature of the patterns. In order to do this, I chose to focus on patternsfull of space and simple,clear lines as opposed to classical and complex shapes.From the reasearch, value is also added to shape as well as colour. For instance,Lotus patterns express calmness and quiet. By introducing a variety of patternsfrom the lotus family and explaining further what they stand for, the user is furtherengaged in the philosophy behind his or her choice of pattern instead of being apassive viewer of somewhat cryptic shapes.

03 Concept

03.03 User Story

Mahmoud and Jenny are a newly-wed couple on a tight budget. They like theirpeace and quiet. They just moved into a studio appartment they wish to furnishto their taste. Their bathroom has boring white tiles and they cannot afford to tearthe walls down and the tenent will not allow doing so as the appartment is rented.Jenny switches on her iPhone searching for any decorative patterns for her newhome and nds this App offering her to customize her own patterns.

As she browses through the App, she is surprised the patterns carry an additionalfeature describing the symbolic value of each pattern. Intruiged, she wishes toknow more about each one in specic. She selects the shape and colour shends most suitable to her bathroom curtain and adds it to her shopping cart. 3days later, she is the proud owner of a calming, peaceful and visually entertainingbathroom.

03.02 Customer Analysis

The target group is applicaple to all ages. Customers are interested in productswith social/cultural value and pertain a sense of local pride. They are interested inindividualizing their products through a DIY approach.


13/32


03.04 Use Cases

The stickers are applicaple to newly furnished houses or small rented spaceswhere individuals are charachterized by being more on-the-go rather thanowning a stable place. This can be true to the following:

1. Beach Houses2. Studio appartments3. Rented houses

Much like a catalogue,the user is engaged in customizing his or her own tile bypicking their prefered geometrical shape. The patterns are non-repetitive andtherefore suit the prefered number the user wishes according to how many tiles hewould like to view them.The purpose of the application is to present the pattern in the most unique way. Itis important to deliver this message visually. By doing so, the Interface aswell asthe patterns must be aesthetically pleasing, culturally symbolic while being mobileand easy to remove, thus the user acknowledges the accessibilty of purchasing asticker. The application should easily communicate how to customize ones own

pattern and what options available there are.

Wireframes 03.05

Sketches HERE


14/32


04.01 Brand Identity System

The main visual aspect of the brand is utilizing white space as part of the design.The patterns as well as the interface are minimal, thin lined and use the circleform as a grid base. Colours are light and earthy for a natural look and feel. Inreturn, the core values within the design of Islamic pattern are not lost, neither arethey resisting a more modern touch. Instead, they maintain a humble aestheticidentifying with both Islamic and Universal pattern. This is acheived by th fusionof several families of pattern and making each family recognizable through onecolour. In the below example, the lotus family is visualized in green, the dottedower family in pink and the seed of life in purple.

04.02 Visualizing Core Values

The opposite page is my most prefered moodboard inwhich core values arevisualized. Simple, clear and to the point. The colours are inspired by the duskytime of day. The thin lines are inspired by spirograph detail line work and nallythe shapes are extracted from the universal shape of several types of fowers andare thusly named after each shape.

designing Islamic

patterns while

maintaining a modern& elegant look & feel

04 Design


15/32


04.02.01 FINAL MOODBOARD


16/32


inspiration for colour,

shape and style of the

lotus pattern

04 Design

04.02.02 LOTUS FLOWER


17/32


04.02.03 MINIMAL INTERPRETATION OF LOTUS PATTERN WORK


18/32


04.03 Interface Image

The visualization of the interface takes upon the same language as the patterns.Colour palette is light and natural complementing the earthy feel of the patternwork. The typeface chosed is Avenir Light, a strict, long and geometric font asthe style of the visual elements inside the App.

04.04 Visual Language

The logo is simple and minimal in form. It is based on the primary grid of anyIslamic pattern. I chose the colours purple and greygenerally because they areearthy as the visual language of the app but more in particular as purple is thecolour of wisdom symobolically. This light shade mixed with grey gives a feelingof a simple and deep essence. The title is to the the point describing the functionof the App with no inuendos.

simple, strict geometric

fontsustaining brand

image

04 Design

AVENIR TYPEFACE


19/32


I S L A M I C PAT T E R N S

F O R

B AT H R O O M T I L E S04.04.01 LOGO


20/32


05 Final Screendesign


21/32



22/32



23/32



24/32



25/32



26/32



27/32



28/32



29/32



30/32



31/32



32/32

iphone app design + research

Documents