identiSPACE final major project
2 / identiSPACE
/3
Danny Taylor 0909466 Product Design & Interaction University for the Creative Arts May 2012
+44 (0)7856961480 hello@itsdannytaylor.com
4 / identiSPACE
/5
table of contents Introduction 6
UI Design
40
Background
Theory
42
Research 10
48
What is a workspace?
12
UI explained
50
Who is a workspace?
15
Advanced UI
52
Usergroup
16
Haptic feedback
54
18
Incorporation
Finding Function
20
Scenarios 58
Interviewees
22
Marketing 62
Interviews
24
Endorsement
64
Ethnographic observations
26
65
Relevant literature
27
Advertising
66
Design 28
Identity
68
30
Critical Analysis
70
Advancement
32
Refinement
34
Bibliography 74
36
Other relevant projects
First steps
Final design
8
UI examples
Direct-to-user advertising
56
Self-reflection 72
References 76
6 / identiSPACE
/7
introduction
The workspace is an area of function and of action - it serves as a platform from which we are able to sell things, call people, design things, compute things and change things. How are we able to effectively provide an efficient space to work, without eliminating the personable aspects of existing workspaces?
8 / identiSPACE
background Designers mould the way we live our lives. They work in conjunction with engineers, scientists and inventors to change our daily routine, make our cup of coffee less impacting on the environment, advance the human race, or destroy it.
inevitably lose some of the skill that is associated with being a designer. It is assumed that things completed with the aid of a computer are designed by the computer only, and this is of course not true.
Traditionally, designers have been thought of as suit-wearing individuals that draw pages and pages worth of ideas, eventually arriving at a worthy solution to a big problem. This view could not be further from the truth, in fact.
As ‘design’ begins to become a household term - particularly “product design” - it is more important than ever that we start to reverse our transition to completely static digital interpretation, and introduce the ‘human’ aspect to the design process once more; that is the aim of this project.
Designers needn’t wear suits, and quite rarely do they work with pen and paper. The tradition of sketching is now usually reserved only for ideas that will only be seen by the designer - a sort of reminder of something that must be put into the digital world when the time is more appropriate. This is a problem because, as we progress deeper into a completely digital way of life, we
/9
Top, Traditional designer. Online; New designers tend to shy away from hand-sketching. It is viewed as much more difficult than desiging in CAD. It is this antipathy that drives consumers to believe that ‘product design’ is a simple case of clicking buttons on a computer. Bottom, CAD environment. Online; The benefits of CAD are obvious - designs like these take a matter of hours to create, and with lighting effects that can challenge even mother nature, drawing by hand seems archaic; this is true, perhaps, but far less human.
10 / identiSPACE
/ 11
research
“It is the beloved and the quotidian that we often take for granted, precisely because of their unfailing functionality and ubiquity.�1
1, Allan Chochinov, Design Revolutions.
12 / identiSPACE
what is a workspace? My first research for the Final Major Project centered around the meaning of a desk; how could I personally reflect on something so ubiquitous that it is often not thought about in any particular context. I started by looking around me. I sit at my desk to achieve a wide-ranging spectrum of tasks, including freelance work on my laptop, watching a movie on my TV, playing on my Xbox 360 console, composing music and of course, writing up University work. Such a wide range led me to think about the possibility that desks may in fact feature ‘personalities’ as depicted by their users. To test this, I looked not at my own desk within my room, but within the office that I work at. There are three desks - one for each colleague - which repre-
sented perfect canvases which I could study. It became clear very quickly upon scrutinisation that my desk was the most “cluttered”, whereas Sophie’s desk featured photographs of loved ones, and Steve’s was constantly kept immaculately clear. Consequently, it could be argued that Steve’s desk reflects his personality and taste - he wears minimalist clothing that features no visible outlandish label/brand, and he is seen as a calm and collected individual who enjoys a methodical approach to all things. On the contrary, Sophie is rather loud, somewhat brash, yet loveable and bubbly. She wears bright and patterned clothing with a high degree of variance throughout the week.
/ 13
Top, Clutter-free desk. Own work; Notice the layout of the desktop icons - everything on the desk is kept to a minimum, and all items essential to the offices’ smooth runnning (such as the inbox and folder) are kept in a neat and specific place. Bottom, Cluttered desk. Own work; Perhaps the opposite, with papers scattered frivolously and without order. Though chaotic to a third-party, the user of this desk is quite happy within this environment.
14 / identiSPACE
/ 15
who is a workspace It had become apparent to me that one could almost ask ‘who’ a workspace was, as the distinctive patterns seen at my office were reflected across the world.1 Uta Brandes & Michael Erlhoff are the editors of a fascinatingly insightful book that catalogues this: “My Desk Is My Castle” 1. With such an extraordinary level of customisation, I found that it would be necessary for the purpose of the project to narrow down a user group to a specific set of people, not just anybody that uses a desk. I looked at the office to see if there was any way in which I could design a solution to a problem, and whilst it was possible to do so, I felt that for my final project, I should be doing something more challenging and
unique. I went on from this to find my usergroup through constructive tutorials with my tutor.
1. Brandes, U., Erlhoff, E. (Eds.) 2011. My Desk is My Castle: Exploring Personalisation Cultures. Switzerland: Birkhäuser. Left, Nerve Centre. Own work; The desk of this individual is far from organised, yet the user insists that they know the location of everything of relevance to them. The desk extends beyond the bounds of the image to a pin-up display board, which features even more chaos.
16 / identiSPACE
user group Finding a precise user group was the first major hurdle in my design process. One inevitably wants to create a ‘one-size-fits-all’ solution, but this is arguably impossible to achieve in the first place, and so as a designer, one must be able to find specific, almost ‘niche’ users to fill the needs of - Bill Moggridge of IDEO explains that “...if you sort out the extremes, the middle will take care of itself” (Moggridge, 2009)1. I quickly established through the use of mindmapping that the number of possibilities for desk-use was virtually infinite, and therefore began to hone my choice of user. I wanted to create something that I would be able to use myself to facilitate my life, but didn’t want it to center around my current job, so I began to look at what I do as a student.
I am a product desinger, which means that I have to draw things. Being somewhat oldfashioned, I enjoy using a drawing board when sketching, as I find it to be more comfortable and engaging, as well as more experiential. Looking further into this field, I discovered drawing tables that are used by architects and engineers when sketching plans that need to be to exacting standards. I decided to use this notion of a drawing table, but wanted to open it up more so as to enable designers such as myself to use them also.
1. Hustwit, G., director. Objectified. Bill Moggridge. Swiss Dots Ltd, 2009. Right, User Group Exploration. Own work; Initial brainstorm to establish appropriate user groups.
/ 17
18 / identiSPACE
other relevant projects Microsoft Surface Microsoft Surface (“Surface�) is a commercial computing platform that enables people to use touch and real world objects to share digital content at the same time. The Surface platform consists of software and hardware products that combine vision based multitouch PC hardware, 360-degree multiuser application design, and Windows software to create a natural user interface (NUI) for users.
Microsoft Surface, Surface Seen here as a restaurant table, the Surface is able to help users interact with software in a more natural way than previously.
Microsoft Surface, Surface The surface is also capable of detecting objects and displaying relevant content.
/ 19
BendDesk BendDesk is a multi-touch desk environment that seamlessly combines a vertical and a horizontal surface with a curve into one large interactive workspace. This workspace can be used to display any digital content like documents, photos, or videos. Multi-touch technology allows the user to interact with the entire surface using direct manipulation and multi-touch gestures.
BendDesk The BendDesk is a seamless combination of both desk and monitor. The user can place objects on the desk, such as a mug or papers, without affecting the performance of the device.
BendDesk The desk can also be used as a multimedia centre. Here, the user is sorting through photographs in a novel fashion, and can choose to have some images permanently displayed on the dark strip in the middle of the BendDesk.
20 / identiSPACE
/ 21
finding function
Through interviews and first-hand experience, I have garnered a comprehensive collection of features which will be included in the final design.
22 / identiSPACE
interviewees Method Interviews were conducted with two prospective users based on the previously-decided user group analysis. Interviewees were each spoken to at their own offices for circa 30 minutes, and were asked direct questions such as “which tools do you use to facilitate your use of a drawing board”, and indirect, open-ended questions such as “describe your ideal working environment”. Interviewees were also invited to ‘request’ solutions to problems that they encountered daily.
/ 23
Leigh Brooks, MVO, RIBA Partner, BWP Architects “Leigh Brooks completed his architectural training under the personal tutelage of eminent architectural historian Professor James Stevens Curl in 1995 after which he spent eight years working as Project Architect and Senior Associate on numerous highly prestigious projects including the award winning works at Gonville & Caius College, Cambridge and the new Brownsword Market Building in Poundbury.”
Gary Jackson, ARB MD, SpaceStrategy “Gary is the Managing Consultant at Space Strategy. He draws on over 18 years of experience in consultancy – both architectural & master-planning. Having the specialist expertise to fluently control the project process, Gary creates the right ‘conditions for development’ supporting ‘positive’ place and space making; itself, founded on an implicit understanding of delivering individual buildings.”
24 / identiSPACE
interviews Speaking to Leigh and Gary was paramount in opening my eyes to the functional requirements that my product had to meet. One of the first things that I wanted to establish was whether portability was important or not. Both architects showed me what they described as ‘standard’ documentation that needed to be taken out to the field whenever they visited a site. Each folder was filled with hundreds of drawings, legal letters and samples, and each folder weighed around 4kg each! We concluded that portability was of paramount importance, to help alleviate this inefficiency, I suggested that perhaps an entirely portable device would be counter-intuitive, as not all of the
functionality would be required out in the field. Both architects agreed with me, and began to describe the requirements of the portable aspect of the project. On-site alterations to designs are common, but not necessarily good practise. A change can be made without a surveyor/engineer present, which leads to complications later on in the build. A portable, large-format ‘tablet’ (small, iPad-sized screens are simply too small to display the large drawings that are common on-site) where drawings can be shown and annotated, and where regulations can be brought up is perfect. Both stressed the need for limitations, as frivolous alterations to designs can be problematic without input from other key partners.
/ 25
Such an example technically requires flexibility, wireless internet capabilities (4G), storage capacity (cloud-based storage, perhaps) and power. Functionally, it needs to be able to display drawings or three-dimensional models, have a catalogue of up-to-date (and most likely online) products from suppliers, a bank of up-to-date building regulations, and the ability to collaborate with surveyors/engineers whom aren’t necessarily on-site (this capability is popularly referred to as BIM, or Buildings Integrated Management software). Precision is also of paramount importance - this means the finger must not be the only input peripheral, but instead a pen/mouse would be more suitable.
The suggestion of tactile feedback to facilitate showing samples to clients was eagerly received, with both interviewees placing a high level of importance on the technology used - both were heavily against the use of touchscreen technology as simply a matter of habit. Today, software usage remains very much constant accross most architects. AutoCAD is used for 2D drafting, and Sketchup Pro is used for 3D modelling. On top of this, Photoshop and InDesign are used for presentation purposes. The operating system (Windows/Mac) is very much a personal choice, as all software is available on both platforms.
26 / identiSPACE
ethnographic observations Watching each architect work within their office was very useful in establishing what was personal practise and what was standard. Conference calls on Skype or Cisco software played a vital role in connecting the different key partners on projects, such as the architects and the surveyors. When online, conference calls took place between the client and the architect, with samples being shown, drawings being sent, and alterations being discussed. I noted that there were no realtime annotations being made, as the software currently does not allow for this; instead, files were sent, altered, and then sent back to the other party members to review.
Around each office were various catalogues containing samples of products from a huge variety of different suppliers, as well as shelves of folders detailing the many legal standards that must be adhered to.
/ 27
relevant literature At this early stage in the project, the following titles have helped to direct my research:
My Desk is My Castle - Uta Brandes, 2011 Universal Principles of Design - William Lidwell, Kritina Holden & Jill Butler, 2003 Ingredients (No. 2) - Chris Lefteri, 2007 100 Things Every Designer Needs to Know About People - Dr. Susan M. Weinschenk, 2011
28 / identiSPACE
/ 29
design
Here I will show a brief history of the design, with the main stages of its’ evolution explained.
30 / identiSPACE
Top, Thumbnail images of various modes of use. Own work; (from left to right) desk/off mode, drawing table, computer desk (prominent flat area with curved display) and conference mode (small flat desk area with upright display for full-scale real time conference calls). Bottom, Productivity area. Own work; The concept here is to provide a total work environment, that is, the desk is combined with the computer and as such, an entire office can be created using this one piece of hardware.
/ 31
first steps Cited as a “productivity desk” rather than a workspace, my first design was conjured up shortly before speaking with my user group, after having researched near-future technologies such as the flexible AMOLED which features prominently in this example. The concept here is to provide a total work environment, that is, the desk is combined with the computer and as such, an entire office can be created using this one piece of hardware. An electro-haptic capacitive touchscreen was used to provide tactile feedback to the user, with the main implementation being in the form of a virtual keyboard - user innacuracy increases with the lack of tactility in a keyboard, plateauing with touchscreen keyboards that feature no
feedback at all. The electro-haptic qualities of the screen allow users to ‘feel’ the perimeters of each indivudal key, as well as sense when a button had been ‘pressed’. Such tactile qualities extend beyond simple buttons, however. Sample materials and complex textures could all be simulated on-screen. The thumbnail images on the left show the device in its’ various states of use, starting (from left to right) with desk/off mode, followed by drawing table, computer desk (prominent flat area with curved display) and conference mode (small flat desk area with upright display for full-scale real time conference calls).
32 / identiSPACE
advancement After showing my initial concept to both architects, it became apparent that the form of the table was equally as important as the UI. They had issues with the table in that it would have to be used against a wall - they wanted to be able to ‘show off their new toy’, as one architect put it. With this, I got to work on a new form, taking inspiration from contemporary Italian furniture design that I had spied on some research trips to London. Initially, I did not like the form, and almost scrapped it completely, but over some time, it grew on me and I accepted that this would be the overall form that I wanted to use. I feel that the uncluttered design, without space for drawers and shelves, leads to an unpre-
cendented level of ‘focus’ on the productivity that takes place on the top surface. There are no distractions, and as such, the users work literally takes center-stage. Architectural supports that complement the form of the structure were added to reduce strain on the tabletop after rough analysis within Solidworks showed a dangerous flaw with load level on the four corners of the design. The tabletop was designed here as 1300mm x 600mm, as this was a fairly standard size that kept appearing in my research.
/ 33
Top, Front view of revised design. Own work; Note the complimentary thicknesses of the various components. Bottom, Classical angle of revised design. Own work;
34 / identiSPACE
refinement Both architects liked the form of the new design, and both them and my tutors agreed that it conveyed the correct language. With this encouragement, I went on to further refine the details of the design, tapering the legs slightly to compliment the profiles created by the extending struts. The tabletop was also deliberately overthinned to make the table appear more delicate and thus, more inviting.
table, including the tabletop size, and the height of the table. The new dimensions meant that the table would have to be used standing, or with a high stall. I had previously read about the benefits of standing tables [1], and when the architects informed me that they can be sat at the desk all day drawing plans, I was convinced that the initial discomfort would quickly be overlooked.
There was an issue with the design that the architects both rightly picked up on; current desks simply don’t allow them to comfortably view the large drawings that they need to look at. This was in comparison to my design which was supposed to be tailored to their needs. As such, I chose to scale up the entirety of the
1. Standing Desks. [website] http://en.wikipedia.org/wiki/Standing_desk#Advantages [accessed January 19th 2012].
/ 35
36 / identiSPACE
final design
Top, identiSPACE. Own work; The final design marries features from all stages of the project. Bottom, identiSPACE rear. Own work; The desk is designed to be immediately identifiable, even from behind, as a user walks up to it.
/ 37
The final design combines elements of all the previous stages of the design process. Using peer reviews and tutorials, I produced a design which is more feasible to produce, and which I believe is much more inviting. It features a flexible and transparent AMOLED screen which magnetically attaches to a moveable plate, which is controlled by a small switch on the underside of the table top. This movement enables the screen to take a variety of different shapes, depending on the users needs. The simple magnetic fixing was chosent to emphasise ease-of-use - the screen simply shears away as necessary, in a smooth action that requires little effort. To reattach the screen, the
user slides one end into a small cubby close to the edge of the table, and then the magnetic plate aligns itself when placed on the moveable arm. There are no physical connections between the screen and the table. Instead, power is transmitted wirelessly. This enables the device to be removed or attached without the need to fix connections, and without the possibility of incorrect placement, making it particularly user-friendly. The form of the table was designed to look like a workspace - it is not a regular table, and the technical screen compliments the profile of the legs and table top to achieve this.
38 / identiSPACE
Top, identiSPACE alternative finish. Own work; Here, the table is seen with the screen removed and the arms folded flat. Bottom, identiSPACE. Own work; The table is shown here without the screen and the arms raised.
/ 39
40 / identiSPACE
/ 41
user interface (UI) design “A well-designed system has reassuring feedback, so that we know what we’ve done when we’ve done it. On a keyboard, for example, we can tell what we’ve just done because not only do characters appear on the screen, but we can feel the travel of the key itself and hear the little click it makes.”[1]
[1]
Bill Moggridge, Designing Interactions (2007)
42 / identiSPACE
theory At first, the notion of applying human-centric ideals into a 2D user-interface may seem fundamentally incompatible. Indeed, many hours have been spent by not only myself, but countless individuals and professionals at blank screens/ pages, attempting to ‘design’ a more human interface than the last person. I would argue however that for a UI to be human at all, it must not be designed by someone else. Rather, the UI in question must require input or interaction from/with its user to become truly human and truly personal. There are a variety of debates surrounding what is/isn’t considered ‘good’ interaction design - Bill Moggridge’s book ‘Designing Interactions’ is a
Moggridge, B. (2007). Designing Interactions. USA: MIT Press, Inc.
good place to start. In it, Gillian Crampton Smith effectively sums up what interaction design is: “If I were to sum up interaction design in a sentence, I would say that it’s about shaping our everyday life through digital artefacts - for work, for play, and for entertainment.” (Smith in Moggridge, 2007:12) Of course interaction design and user interface design are two very different things, but arguably one cannot exist without the other - an interface of some sort must be present, whether 2D or 3D, to facilitate an interaction, and equally, some level of interaction must be necessary for a user interface to function.
/ 43
It is often difficult for users (and indeed some designers, it seems) to comprehend what exactly ‘interaction’ encompasses. Many believe it to be purely two-dimensional, and represented solely on the monitor of their computer, for only their eyes to pick up on. This is simply incorrect. I believe that interaction is far more than that. As a personal definition, I see interaction as the seamless integration and exploitation of a combination of any number of a users’ five senses to acknowledge the consumption of a particular output or piece of information. Bill Moggridge explains this in a more digestible fashion: “A well-designed system has reassuring feedback, so that we know what we’ve done when we’ve done it. On a keyboard, for example, we can tell what we’ve just done because not only
do characters appear on the screen, but we can feel the travel of the key itself and hear the little click it makes.” (Moggridge, 2007:16) Furthermore, he then goes on to explain Hiroshima Ishii’s concept of the TUI: “This diagram illustrates the tangible user interface, which my group has been working on for the past several years. The key idea is giving a physical form, a tangible representation, to information and computation; this differentiates our approach from the graphical user interface. The tangible representation is tightly coupled with the computation inside the computer, but the representation is physical, so that it also serves as a control mechanism, allowing people to directly grab and manipulate. By doing so, they can control the internal computation or digital information. So the coupling of tangible representation and control is one of the key features Continued...
44 / identiSPACE
theory, continued of the tangible user interface.” (Moggridge, 2007:527) Such tangible interactions are vital for the usability of the digital surface contained within my project. To replicate a desktop in a virtual environment successfully inevitably requires the use of more than simply sight. I conducted a brief ethnographic study at my workplace, setting up a small camera to observe the actions of both my colleague and myself during the course of a few hours at work. Remarkably, the most striking part of the research revealed the amount of time the hands are simply ‘resting’ on the surface, doing nothing. Immediately, it became obvious that traditional touch screen technology wouldn’t benefit such a device - even though the hands were ‘touching’ the surface, the user didn’t want to interact, and so a sensitive touch screen that was receptive to fingertips would degrade the experience.
I also concluded from the study that both my colleague and myself brought in many items to the desk space very temporarily, be it paperwork, a calculator or some stationary artefact. These items would be brought in to the environment, used briefly, and then discarded without thought. It is this nonchalance that I wanted to be able to facilitate within my interface. In light of this study, certain technologies were chosen over others to make the experience more ubiquitous. A haptic-capacitive touch screen AMOLED display was chosen to allow feedback to be transmitted to the user’s fingertips. This technology allows for electronic signals to be passed through the fingertips to simulate textures - most notably, I have specified that a digital keyboard will be used over a traditional sort. The haptic technology within the screen would allow users to ‘feel’ the perimeters of each individual key, as well as feel when they had/ hadn’t ‘pressed’ the key.
/ 45
This, combined with subtle audial and visual cues, adds up to a much more tangible solution than what has existed in previous touch screen keyboards, such as on an Apple iPad. A study conducted by Andrew Sears showed that users typing on traditional keyboards on average are able to type 58 words per minute, compared to just 25 WPM on the touch screen equivalent. He stresses in particular limitations with regards to the ‘touch’ input:
as multitouch technology), others have remained still the plight of touch screen devices. It is these problems that I have addressed within the design of this desk - the technologies are emerging, but feasible, nonetheless.
“The major problem, which is common to many different technologies, was the inability of the touchscreen to identify multiple touches. This made it impossible for users to rest their fingers on the screen, or the ‘home row’, and overlapping touches could not be recognized, forcing a short delay between touches.” (Sears, 1991:16-17) Though many of the issues highlighted within Sears’ study have since been addressed (such
Moggridge, B. (2007). Designing Interactions. USA: MIT Press, Inc. Sears, A. (1991). Improving Touchscreen Keyboards: Design issues and a comparison with other devices. USA: Human-Computer Interaction Laboratory Department of Computer Science University of Maryland.
46 / identiSPACE
UI examples
Left, Default view. Own work; The UI is designed to replicate the look and feel of a traditional desk. Right, Drawing table. Own work; In this view, the user is drawing, and has access to a complete set of digital tools - seen here are a ruler and trisquare, but also notice the use of branded marker pens. Such a lucrative opportunity could extend to other brands of stationary, and of course beyond stationary entirely, further increasing the value of the product.
/ 47
Left, Standard Use. Own work; Here, the ‘average’ UI is seen, with photos of loved ones present, as well as the digital haptic keyboard and a calculator; a total workspace solution is presented. Right, Cluttered. Own work; In this view, the user in question is particularly disorganised - I wanted to keep this personality within the UI, and despite the ability to ‘lose’ paperwork much like in a traditional fashion, the benefits of digitisation are kept, and thus the user is able to search for a document using command lines instead. Note here also the use of hand-written “Post-it’ notes to further enhance the authenticity of the surface.
48 / identiSPACE
UI explained Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
resizeable fonts (pinch-gesture)
write with stylus / type with haptic keyboard
adjustable paper size
active window toolbar drag corner to move page
Above, Default document window. Own work; The UI is designed to appear minimal.
/ 49
The UI has been designed with ease-of-use in mind, so as to enable the relative ‘newness’ of this design to be more attractive. As such, there is a notable lack of buttons. Seen here is a standard document layout in A4 format. The font size is adjustable by using a simple ‘pinch’ gesture, which is far more intuitive than selecting a point size from a dropdown menu. The copy can be created using a stylus to annotate, or the haptic keyboard can instead be used to input data. Upon use of the haptic keyboard, the document automatically displays a peripheral window that features additional options that one would expect to use such as font, underline, script type, etc. The corner of the page is curved slightly to evoke three-dimensional appeal, and when displayed on the curved surface of the screen, looks highly tangible. The user can ‘grab’ this corner to move the page around the screen
- the rotation of the window in question is dictated by this movement. Documents remain editable regardless of their orientation to the user, and this is one of the key features maintained throughout the UI, to better emulate a traditional desktop arrangement. Windows are made active when they are touched. This brings up the active-window toolbar, to show which window is the focus. Different applications will feature different tools, but the basic aesthetic remains the same.
50 / identiSPACE
advanced UI UI design is an emerging field that is fast evolving, in part due to our grwoing reliance upon digital technology with embedded interfaces that serve as platforms to share data. Classically, a user interface has existed solely as a two-dimensional, completely intangible area that was controlled using devices manipulated by the user, such as a keyboard and mouse. Increasingly, however, we have seen a movement towards examples that exhibit more direct input, such as the touch screen. Whilst this is more defined in its approach, it is, by definition still very much intagible. This presents a problem for UI designers. To combat this intangibility, designers have often used photorealistic replication to simulate surface and texture which ultimately fools the user into ‘feeling’ the interface. This can be seen in many examples, notably on Apple’s iPhone - the ‘Apps’ that populate the device are filled with photo-
realistic representations of otherwise traditional ‘analogue’ artefacts. Take for example Figure 1, shown on the opposite page. Note the appearance of stitching along the top banner, and the simulation of ‘pressed leather’ on the logo. Such artefacts are completely defunct in their use - removing them completely would have no implication on the use of the app. What can be drawn from this example is the conclusion that we have reached the limits of what digital simulation can offer. We need to advance beyond traditional features to truly advance UI design. This means that either content must be three-dimensional, or that the two-dimensional data must be more than just visual/audial.
/ 51
Left, Find Friends. Apple Inc, 2011; Here, the UI features heavily leather textures, as well as stitching and pressed leather. Right, Simulation. Apple Inc, 2011; Photorealistic simulations such as these are purely aesthetic, and provide no context or tangible feedback to the user.
52 / identiSPACE
haptic feedback
Above, Senseg Touch Screen Feedback. Senseg Inc, 2012; Here, Senseg’s patended haptic touchscreen technology is seen in use on a modified Android tablet. There are four different textures being displayed at the same time.
/ 53
Haptic feedback touchscreens provide the necessary tangibility to take two-dimensional touchscreens to the next level. By manipulating an electric field within each pixel (known as a ‘tixel’; a texture-pixel), digital surfaces that are traditionally lifeless, glossy glass, become a myriad of different textures that dynamically change depending on the content. Users can ‘feel’ the perimeter of keys on a keyboard (as discussed previously), as well as play texture-incorporating games and feel sample materials. “Feeling something else than lifeless glass when you’re operating a device is simply hugely satisfying. Humans obtain information through sense by exploring with our hands” (Ville Mäkinen, Senseg, 2012)
Such technology provides a platform from which designers are able to enhance the user experience of various digital products, and it is a technology that features heavily in the user interface of my design. I have tried to incorporate new technologies such as the haptic feedback, but have also kept the traditional stylus as an input device.
54 / identiSPACE
incorporation Coupled with ubiquitous touchscreen interface properties, such as photorealistic representations and interaction-altering characteristics such as a button being ‘pressed in’, I aim to create an intuitive interface that needs little/no explanation in order to enable users to adeptly use it.
the lower right-hand corner, and the user must ‘pinch’ this corner to move the window.
In principle, the replication of a worktop is a simple thing to do; one simply needs to look around for viable examples, and design accordingly. The implementation of haptic feedback is slightly more complex, however.
By releasing the software as an Open Source initiative will allow for developers to collaborate and create experiences that otherwise would not have been designed by me.
Obvious areas exist where this technology will benefit - the digital keyboard and calculator, for example, will be enhanced greatly by such feedback. On windows such as a piece of ‘paper’, the technology must be applied subtly in order to achieve the greatest overall effect. In particular, I have specified that it will be used only in
Elsewhere, the ‘desktop’ (that is, the background) will by default be a wooden texture that compliments the finish of the complimenting table top.
In a rather ‘Linux’ fashion, the best features will then be collated into a single operating system which users can then download in their own time, to completely change their experience.
/ 55
Top, Keyboard and Calculator. Own work; Obvious areas of the UI that could benefit from haptic technology include the keyboard and calculator. Bottom, Digital Post-it Note. Own work; Subtle use of the technology accross multiple areas such as this ‘Post-it’ note will enhance the experience and draw together the entire UI. Here, the edge of the raised corner is felt by the user as he/she moves the note around the screen. Note also the background texture.
56 / idenTABLE
/ 57
scenarios
Here, I document the most popular uses for identiSPACE.
58 / identiSPACE
Top, identiSPACE. Own work; Here, the desk is shown in a typical set-up; there are traditional artefacts on the table top, and the user interface is displaying a regular workspace, with keyboard, documents and photographs on show.
/ 59
60 / identiSPACE
Top, identiSPACE. Own work; Here, the desk is shown in its typical office-bound set-up. The user is drinking from a cup which is placed back onto the non-digital surface as required.
/ 61
Left, identiSPACE. Own work; The flexible AMOLED screen is detachable and powered by wirelessly-charged batteries which are rigidly attached to the trailing edge of the screen, or the ‘bottom’ edge, closest to the user. For this example, an architect can bring his/her drawings to a working site to evaluate the situations. Right, identiSPACE. Own work; Here, the screen has been detached from the desk and placed on a flip-pad to be used as a presentation screen. The user is also using a stylus to annotate pages that are shown. This proposal limits the need for peripherals such as a projector, as the screen is large enough to be used by itself.
62 / idenTABLE
/ 63
marketing
Successful implementation of such a radical product requires careful marketing considerations.
64 / identiSPACE
affiliation Keen-eyed readers will have noticed the Copic marker pens seen in the UI demonstration pages. This is not a sales ploy, but rather an example of how traditional artefacts can be translated into a digital form. Users who see the benefits of the digital interface will be able to purchase kit such as the Copic markers much like they would buy an ‘app’ on their smartphone today - the stylus they then use on the flexible surface would then take on the form of the selected colour, and each pack would feature differing nuances that will contribute to the overall ‘feel’ of the equipment. The digital pens would be much cheaper than their traditional equivalents, as they would require no manufacturing or tooling, and their environmental impact - considering their lack of inks and dyes - would be negligible. Of course, pens are just one of a number of artefacts that could benefit from the digital treatment.
Right, Copic digital markers. Own work; Digital versions of popular artefacts such as Copic Ciao markers would be sold like ‘apps’ on a smartphone to be used on the device according to which license was purchased.
/ 65
direct-to-user advertising London has a vast concentration of creative workers - precisely the people identiSPACE will work best with. As such, advertising needs to be centred around cosmopolitan areas such as this, with the existing infrastructure such as the London Undergrounds advertising network with OutdoorCBS.
66 / identiSPACE
advertising
Above, identiSPACE introductory advertisement. Own work; The use of an Eames chair gives the impression that the office in question is one of class. The open question, “what is your office missing?” invokes personal feelings of comparison, a tool used by advertisers to force users to question their existing situation against the backdrop of the advertised ‘perfect’ situation.
/ 67
68 / identiSPACE
identity
identiSPACE identi
SPACE
Top, Identity Concept 1. Own work; Here, two colours are used to symbolise the differing spaces on the table surface. Bottom, Identity Concept 2. Own work; The ‘identi’ part of the title has been raised to symbolise the changing surface height.
/ 69
E C A P S i t n ide Top, identiSPACE identity. Own work; The two-colour idea from previous examples was kept, and the text is positioned on a curve to symbolise the main aspect of the product - the curved screen.
70 / identiSPACE
/ 71
critical analysis
Here are my views on the outcome of the project, three months from its inception.
72 / identiSPACE
self-reflection Overall, I am extremely pleased with the outcome of this project. Although a slight degree of deviation has occured since the original stages, I am sure that this has added to the strength of the brief in total. Through thorough user research, and by involving the user group from early on in the design process, many hurdles were overcome. The most notable change is the migration to a semi-digital surface; at first, I wanted to use a totally digital surface, and only through consistent user involvement did I realise that this was not the best approach. The implementation of a half-digital, half-traditional worktop worked out to be the best option, and one which I would have overlooked without conducting proper user research. Even with these changes, I still feel that the endresult has stayed true to my original brief, that is, a digital surface to augment traditional workmanship.
Feedback from my user group is positive - both the architects I interviewed said that they would consider buying identiSPACE should it actually exist, and both were willing to spend over £5000 to get their hands on one. I’m inclined to agree with them, and could happily envision working with identiSPACE instead of a laptop or computer. Feedback from my peers has been equally as positive - this is perhaps the most important feedback for me as a designer, that is, the feedback of those in the same field of design as myself. With more time, I would have liked to explore the ergonomics of the form and UI more, to produce a more well-rounded design overall. I would also have liked to investigate the possibility of retrofitting the technology to existing surfaces.
/ 73
74 / identiSPACE
/ 75
bibliography
Material that has helped me throughout the project can be found here.
76 / identiSPACE
Scott, J. (1999). Seeing Like a State: How Certain Schemes to Improve the Human Condition Have Failed. USA: Yale University Press. McCandles, D. (2009). Information is Beautiful. London: Collins. Weinschenk, M. (2011). 100 Things Every Designer Needs to Know About People. USA: New Riders Brandes, U., Erlhoff, M. (Eds.) (2011). My Desk is My Castle. Switzerland: Birkh채user. Lefteri, C. (2007). Ingredients: A Materials Project by Chris Lefteri. UK: Middlesex University.
Lidwell, W., Holden, K., Butler, J. (2003). Universal Principles of Design. USA: Rockport. Moggridge, B. (2006). Designing Interactions. USA: MIT Press Inc.
/ 77
E C A P S identi Danny Taylor 0909466 Product Design & Interaction University for the Creative Arts May 2012 +44 (0)7856961480 hello@itsdannytaylor.com