55

COLLECT

Enriching hardware interfaces by bridging the gab between digital and physical

Visualizing digital contents by translating them into 3. dimen-sional shapes and structures.

Collect is going to be a physically present collection for digital contents. Quite like a shelf of a home library just with a different kind of content.

The underlying idea of Collect integrates three main as-pects, enriching hardware interfaces and therefore bridg-ing the gab between the digital and the physical world. And the inspiration derived from the observations of people living and interacting with informal, physical col-lections.

Inspired by physical collec-tions: Addressing of all human skills and stimulation of physi-cal interaction.

Concept definition

56

COLLECT

Design Process Insight

57

COLLECT

The translation here is based on 2 dimensions, the size of a file and it’s age. The position in height is representing the files age. The green base is where they origin. And its also supposed to act as a tool for searching.

The first trials to develop such a product system explore ways of translating data into physical objects (one file = one obj.), a structure which provides interactivity. Around the translated data I am going to introduce a selection of tools for affecting this structure and perform some es-sential activities like organizing, searching, browsing and consuming content

agesize

Translation of digital structures 1

attractorsThe next idea was to let elements also move on their x and y-axis, to make a search based on keywords pos-sible. By naming attractors with certain keyword, topics or themes and placing them on the edges of the matrix they will make data elements group around them. That signifi-cantly divides randomly organized data by there identity and relation to each other.

The time line Is an important part. It represents the age of all recorded data elements and aligns them between the oldest and the latest file.

That creates a more readable visual structure of data in-formation. But there is still no solution for visualizing their inter connectedness. This will require that they are free to move.

search by: time, similarity groups The next step was to add a separate search tool which still uses a time line but isn’t anymore the component where data origins. The base just has the function to communi-cate which elements are empty and therefore free to use. Data which slides back into it, will be deleted.

58

COLLECT

Translation of digital structures 2

Build and rebuild

Data objects can’t fly around. Due to the fact that ele-ments have to be able to move the system slightly chanc-es. Because elements can be built, they also can be re-built somewhere else and affected elements around them get restructured as well.

Now when keyword-based attractors are applied to the matrix, elements are just going to be rebuilt to shape the new structure.

Benefits:

Files which are well described that means much meta-data is available, will build a better organized structure then others which are poorly named or annotated. So, The mess will be visible and is going to remind the user. But the idea is not to tease users and remind them of how sloppy they are acting on their data. Okay, to be honest, this effect is taken into account. I see it more like a stimu-lation.

3 dimensions

agesizesimilarities

Sometimes we have to cope with a negative experience to experience a greater positive one. One example is the use of an alarm clock. To be woken up by a loud noise is certainly not pleasant but all positive situations which are in relation of getting up at the right time can just be expe-rienced because this negative event.

59

COLLECT

1

2

3 4

5

Data platform and toolsUsage storyboard

synchronize translate data

mark topic areas add missing description

preview and describe data search for data

select data pick and enter data

data positioning delete data

60

COLLECT

1 Translation of data information and file properties:

• relation to other digital objects = position (x, y)• file size = growing element• usage and age = position (z)

the translation dynamically updates according to the available information (moving data objects)

4 searching for content. Input:

• keywords (descriptive information)• time

addressed objects will respond.

2 tidy up the mess

by positioning topic markers data objects can be divided into rough topics. Elements will be rebuilt into these areas if their description matches the description of the area.

5 pick search result

remove objects from data platform and transfer them to a tray. For consuming digital content use 3 to transfer content to a displaying device.

3 preview and adding description (for moving ele-ments into groups)

Translate, organize, search, pick and consume

Reassembling product environment

There are good reasons for editing data on PC or laptop. Editing is more performance-oriented and therefore the interfaces of common solutions provide the best setup.

Some organizational tasks and other activities around informal collections have different characteristics and need a different environment. Organizing, for example works very well in shelf-like setups, where people can locate single items by their location. Arranging them becomes a creative activity and therefore more enjoyable. Consuming digital content bet-ter takes place in very communicative environments, where content can be shared or ex-changed easily.

editing

organising, browsing and searching

consume

61

COLLECT

1

2

3

4 5

5.1

Data platform and tools

62

COLLECT

5.1

1

2

3

4

5

SHELF

RUMMAGE

TRAY

SEE

FENCE

PORTORGANIZETRANSFER DIGITAL CONTENT

TRANSLATE

SEARCH

SELECT

CONSUME

After defining the most important activities around the digital collection I had to find the right tools to express them.

My aim was to look at these activities separately. The tools should be working around the data platform and be restricted to their function. Basically, they work like tokens which have one essential functionality. The tools just work in combination with the platform or other tools, they have no stand alone functionality.

Tools which are directly applied to the data platform are:

• keyword marker• search tool• annotation and preview tool

Tools which are not or non-exclusively applied to the data platform are:

• annotation and preview tool• the data element tray and• the displaying device for entering full content

63

COLLECT

SEARCH

Flowcharts

CONSUME

PERFORMATIVE EXPLORATIVEDo you know the exact definition

of content?

Are you looking for a single item or a range of files under a topic?

Activate speech recognition by touching funnel

A single item.

Yes,

Calling in file name and it will answer by changing light inten-

sity (passive to active)

Pick element to consume

Pick element to consume Select item

I am into a topic and want to consume a range of files ac-

cording to this topic.

Call keywords and select result

Additionally set time of creation (liked with frequency of use) to

limit down result.

Select result

No. I have to find it

Do you know the exact descrip-tion of the desired document?

No. I just want to see what’s there according a wide topic

(explore)

yes, i can name a range of keywords to specify content.

Calling in file name and it will answer by changing light inten-

sity (passive to active)

Name as many keywords as you can come up with to specify and limit down the answering items

To you want to select a single item or multiple data elements?

I want to enter a range of 1- 5 elements. I want to enter more elements

For more than 5 elements it can be annoying to transfering every single content, so there is a pos-sibility to pick selected elements off the platform by using the tray

tool. And browse through in a more comfortable position.

Its one single item I want to enter

To enter just one element trans-fer content from data element to paper by using the magnifier tool. Extract content out of ele-

ment and put it onto paper.

transfering content for every item by using magnifier. From board

to paper.

No, omg. Its a mess and quite a lot of my files cannot align with

any group.

Are all data elements now orga-nized into groups of a particular

location?

Are you satisfied with the dy-namic physical translation?

Synchronizing digital collection with product (physical represen-

tation of collection)

Translation of digital structures (folder structures) into physical

order (time and space)

Locate groups by adding group marker to scene.

Yes, now all my data is themed, grouped and located right, there

are no loose elements.

Yes, by annotating them with the group theme or a similar keyword they align to group.

Yes, it pretty nice to see I am do-ing well with structuring my files.

No, there are still loose ele-ments on the platform.

Preview loose elements and an-notate them to make them able

to align with set groups

Do they match an existing group?

No, I see in the preview that there are no groups which

match.

By setting up a new group the loose elements align with the marker and group with others.

ORGANIZE

The flowcharts helped to define processes and opera-tions around the tools for interacting with the data plat-form. The goal was to find ways to integrate some aspects I was able to observe while people are interacting with physical collections, like ritual and ceremony-like task without making them to complicated and time consuming.

64

COLLECT

Following images were design inspiration and provided metaphors for creating more natural interaction styles. One example is the funnel which immediately associates that one can call something in or that sound comes out of it. In this case the user calls in keywords so that the data elements can physically respond if they are addressed.

The next two pages show an excerpt of the sketch work for Collect. This ideation explores the construction of functionality and the appearance of the data platform, it’s data objects and the tools.

Design metaphors

httpwww.google.atimgresq=silver+platter&hl=de&sa=X&biw=1343&bih=686&tbm=isch&prmd=imvns&tbnid=OOgrOfepu8JeuM&imgrefurl=httpwww.denversings.com-silvergoldblog20110708the-silver-platter-opportunity-jim-willie-cb&docid=qNInO7xLqPmaWM&w=400&h

http://farm4.static.flickr.com/3460/3757093701_e79747e1cc_z.jpg?zz=1

http://www.flickr.com/photos/joeysplanting/2293517978/sizes/o/in/photostream/

http://www.flickr.com/photos/hellmy/2475023471/sizes/l/in/photostream/

65

COLLECT

80

6.2. Sketch Exploration

82

marking topic areas

previewing anddescribing data tray

66

COLLECT

81

DESIGN EXPLORATION

83

DESIGN EXPLORATION

data objects

searching

displaying content

67

COLLECT

After some very rough paper mock-ups I decided to do the first cad mock-ups to explore their dynamic prop-erties, like the interplay of movements by animating first sequences to define actions (applying tools) and reaction(responding data objects).

Cad mock-ups and dynamic processes

growing dataelements

fence with label(foldable)

rummagesearch tool

68

COLLECT

30 x 50 data elements = 60 x 100 cm = 1500 data objects = 22GB

Due to the fact that the extension of a collections, espe-cially of physical ones is of high importance, because it’s something a collector is mainly proud of. Apart from that, the collection should not be too big to provide the neces-sary limitation of elements. I decided to work with a data platform of 1500 data elements. That’s quite big in size,

There is nothing new about this idea. But there is one in-teresting aspect about a wall mounted device, it becomes a picture and like a picture it gives information and im-pression of what it is.

Earlier in my thesis I wrote about experience framing. Framing a picture and hanging it up on the wall is like that. You put it in the right scene, put it how you like it best. Something on the wall that is nicely set up is more likely to be looked at than something standing on a table or put onto a shelve. A wall installation is likely to have higher priority and gains more visual attention.

Because of the impression of a precious painting on the wall it has an increased value.

600mm x 1000mm. These dimensions are also inspired by the size of a painting on a wall, it shouldn’t be smaller in terms of communicating its values and importance of physical presence. The whole system can be modular as well and therefore impressive collection can be built.

Wall-mounted devices A collections volume

69

COLLECT

search tool, Rummage

data platform, Shelf

preview and annotation tool, Port

data objects, Digitals

Traydisplayingdevice,See

CollectThe product family

70

COLLECT

Translation of a digital collection

Synchronizing the shelf with a digital collection. The vi-sual representation uses all available information, like file descriptions and other available meta data.

This translation shows a quite messed up collection. There is less descriptive information available.

Dividing content/rearranging data elements

The shelf and it’s data objects work like a pin board where the pins automatically rearrange when topic or theme ar-eas are set.

Corners and the center or the shelf are the most attrac-tive locations for locating a topic. The space in between comes next.

Dynamic data structures

71

COLLECT

Nests of data objects

After setting up some topic areas by using the Fence tool the data objects will rearrange if the existing descrip-tive information matches with the topic.

Some objects might be badly annotated or named, so they won’t move into the areas although they might be-long to one. By using Port you can preview and add in-formation by just calling descriptive keywords.

Others just not belong to an existing group. Here a new Fence can be set or not.

Picking search results

Whereas Port is characterized by it’s more explorative search or browsing, Rummage is more performative. It uses information like keywords and time settings to pro-vide search results.

Here 4 results where located and picked. After picking them they leave a hole behind, so it is clear where to put them after consumption.

Tray works as a stand or station to avoid objects lying around and getting lost. It also carry them around and place them wherever they are entered.

72

COLLECT

Shelf

73

COLLECT

Shelf detail, growing data objects

The position of a data object represents how often it is used and how old it is. Rarely used and old files will move towards their origin, the shelf. By pushing the object back into the shelf content get deleted an the object is free to represent (get filled) with new content.

74

COLLECT

105 mm

87 mm

82 mm

7,6 mm

20 m

m

Mounting the platform is realized by a socket which fits the legs of the shelf. The Socket is mounted on the wall by 4 wall screws and is made of solid hard plastic.

Mounting the shelf

75

COLLECT

Growing data objects

Growing and rearranging

The building and rebuilding of digital objects is realized by a set of piezo motors. They are coordinated to move the elements up and down (outer tube) and to adjust the size by moving the inner tube. The piezo motors therefore are able to move on a grid inside of the shelf to reach the objects.

PiezoLegs, linear actuator

76

COLLECT

Shelfempty

a messed up data collection

Organized by using Fence

77

COLLECT

Digitals

78

COLLECT105 m

m

5 mm

max. 20 mm min. 8 mmThe data object consists of three parts: two tubes, outer and inner and the elastic volume on top. The outer tube is moved to position the object according to their age and frequency of use. The inner tube is moved to regulate the size of the data object. Therefore, an elastic part on top of the object is deformed by sliding the inner tube in and out of the outer one.

Additionally, the inner tube can be lit-up by an led light inside the shelf, so they can respond when they are searched.

Digitals

79

COLLECT

Collect encodes the digital complexity caused by the large amount of digital content we collect and store.

It gives every file we own a physical representation. By being tangible and physically present data gains a kind of value we know and experience from building and living with in-formal collections in the physi-cal world

Collect, a tangible and physi-cally present collection of digi-tal content which invites the user to interact with the organi-zation of his or her digital pos-sessions.

80

COLLECT

Toolbar

The toolbar holds a number of tools which allow organiz-ing, previewing (browsing), describing and searching for digital contents. These contents can also be extracted from their objects (container) and placed onto a display-ing device for consuming them in every comfort.

81

COLLECT

Toolbar

Fences Port Rummage Tray See

82

COLLECT

Marking topic areas

Fence is the smallest but probably the most effective tool. Just by placing it’s two parts onto the Shelf, data objects are going to react on the new requirements. They rear-range according to the keywords set on the Fence.

Fence

83

COLLECT

98 mm

143

mm

47 m

m

Fence

Fence is equipped with display technology and a funnel element which indicates that speech recognition allows verbal input to as-sign topic descriptions.

The label, where keywords are displayed can be turned to direct to the second part or it can be tilted up for not covering objects.

84

COLLECT

Port

Port shows a preview for browsing through content and gives the possibility to add de-scriptive information verbally (funnel ele-ment).

Furthermore, content can be extracted form it’s object to be transfered to See.

85

COLLECT

Port

120 mm

36 mm

22 mm

86

COLLECT

For adding descriptive information keywords call be called into the funnel element. This design element is repeated on every tool where voice recognition technology makes it possible to add information by calling keywords.

extract content by sucking it in and out of the object

releasing content by pushing it out of Port and onto See

Port

87

COLLECT

Port

88

COLLECT

Rummage

Rummage is an interpretation of how digital processes, like those for data search can be translated into physical shape.

The most dominant part is the funnel, that’s because call-ing keywords through the Rummage into the Shelf is not just the most effective task to make data respond it is also the most natural and instinctive action. The possibility to also use time settings is secondary. A rough time range can be set by moving the ring elements on the tube shape which represents the relative age of all data objects.

89

COLLECT

Rummage has a hidden feature which makes a more precise time setting possible. It’s hidden because in most cases a rough time setting is enough.

Rummage also has a label element which displays called keywords and time settings.

Rummage

60 mm

40 mm

220

mm

78 m

m

90

COLLECT

Tray

Selected data objects can be picked directly out on the Shelf and placed onto Tray to avoid loose objects and loss. A tray has special semantics, it suggests that something of high value is carried, which perfectly fits the idea of the representation of personally meaningful data.

91

COLLECT

200 mm

88 mm

15,3 mm

7,8 mm 12 mm

33 m

m

Tray

92

COLLECT

Picked data objects

93

COLLECT

See

Port extracts content and places it onto the folded display

94

COLLECT

See’s display is folded 3 times to provide the “turning pages” look and feel and more important to give space for different sized content. Therefore movies can be watched on the 3-pages sized format and other content like literature can be read one page after the other.

The allover design is an interpretation of a book. So, see also has a spine which indi-cates keywords of the digital content. The cover has a surface mold for folding it to a stand.

See

95

COLLECT

96

COLLECT

97

COLLECT

Timetable

defining final functional structure and product setup• stage two mockups• 3D proportioning

Total project duration is about 20 weeks.

mayaprilmarch june

presentationof research,

findings and initialdirections

initial conception• brainstorming• sketching • mockups to explore key directions

• exploring topics of concern• research in special design disziplines:• human computer interaction• aesthetics of interaction• experiental user behaviour studies• affective and transformational products• designing highly interactive things• joy of use • (building on usability and ergonomic concerns)

initial and core research

• narrowing down research:• focusing on user experiences around• digital objects (collecting, storing and interacting)• users process of sense making and data value• rational and emotional impact of interaction trends

additional research

• user experiences, usablility and technology (software and hardware) • human perseption and intuitive use (humanizing technology)• finding design approach in physical interactive systems (physical collections)• approaching a hybrid system (physical/tangible interaction with computational support)

refining product conception:

• allover interation styles and • derivated design language

conceptional exploration on components and functional aspects

TIMETABLE

research in front additional research

• technology and usability in human computer interaction

conceptional freeze,

documentation of research

98

COLLECT

Timetable

july august september october

defining final functional structure and product setup• stage two mockups• 3D proportioning

final design

design freezesketching and 3D visualisation

final 3D modelling

colour and material

submission of diploma project

and admission for diploma examination

final presentation and diploma examination

final animation

presentation

storyboarding for animation

vacation

final layout and arrangement

be away sick (broken hand)

printproject documentation

• ergonomic tests• interaction sequences

conceptional freeze,

renderings

99

COLLECT

Literature:

Joy-of-Use - Ästetik, Emotion und User Experience für interaktive Produkte, Inga E. ReepsTechnology as Experience, John McCarthy and Peter WrightExperience Design - Technology for All the Right Reasons, Marc HassenzahlPleasure with Products: Beyond Usability, William S. Green (Editor), Patrick W. Jordan (Editor)

Token+constraint systems for tangible interaction with digital information - BRYGG ULLMERZuse Institute Berlin (ZIB) and HIROSHI ISHII MIT Media Laboratory and ROBERT J. K. JACOB Tufts University

THE NEGATIVE EFFECTS OF TECHNOLOGY-DRIVEN PRODUCT DESIGN ON USER-PRODUCT INTERACTION AND PRODUCT USABILITY, PELN GÜLTEKN

http://uxdesign.smashingmagazine.com/2007/11/26/monday-inspiration-user-experience-of-the-future/

http://www.core77.com/blog/core77_design_awards/core77_design_award_2011_radio-ball_notable_for_diyhackmod_20145.asp

http://tidal.sesp.northwestern.edu/

http://www.sorrythatusernameistaken.com/2010/03/09/a-taxonomy-of-interesting-and-unusu-al-folder-names/xampplite_final_folder_structure/

http://blog.hazardous-business.com/?attachment_id=25

http://www.flickr.com/photos/byspice/2329396003/

http://www.flickr.com/photos/hellmy/2475023471/

http://www.flickr.com/photos/buddhagirlaz/4897472455/

http://www.flickr.com/photos/mtischendorf/4945494249/

http://www.flickr.com/photos/varnishdesign/5351719749/

http://metroillustration.wordpress.com/page/2/

http://www.physorg.com/news/2011-04-glimpse-archives-future.html

http://emusician.com/aux_hardware/emusic_percussaaudiocubes/

http://kenthouz-singoedan.blogspot.com/2010/06/multi-touch-screen.html

http://designinteriordecorating.com/computer-multi-touch-desk-futuristik-interaktif.html/futuristic-interactive-multi-touch

http://www.designworksgroup.net/monopoly.htm

http://weheartit.com/entry/11022676

List of references