Kinfo is a familial social network designed to allow users to discover and document their ancestral roots, explore their living family network, and share media together.

I got the idea for Kinfo after realizing that the number of relatives I had heard about far outnumbered the relatives I had ever met.  Growing up, my parents would casually reference cousins, aunts, and uncles who were notable for one reason or another.  I could never remember their names or which side of the family they came from, but I knew that someone was a former FBI agent and someone else lived in Paris and someone was a Professor of Mathematics.  My own social world didn’t have anyone like that in it, and I wanted to know who these people were, and that I could call on them if I ever needed their expertise.  I also wanted to know the history of my ancestors, but the stories and photographs were spread across many great aunts and great uncles I didn’t know.  Lastly, I felt that the older I grew, the more distant my extended family seemed to me. We would get together a few times a year for holidays, and spend most of our catching-up time just reacquainting ourselves.  I knew this situation was far different from the large and close-knit families that other people had.

The heart of the application is the family “hedge”, an innovative (and patent-pending!) way to explore your family, your family’s family, and so on. Here’s an example of television’s Soprano family in Kinfo:

TV's The Sopranos as shown in Kinfo's "Family Hedge" interface

Here’s a video of the hedge in action:

Kinfo’s main function is the sharing of family photos, which are all pooled together to create a massive collaged timeline of the entire family’s photo collection.  You can browse through the collage by person, event, or year.

My family's pooled photos in Kinfo's "Collage" photo viewer

Here’s a video of the Photo Collage in action:

If you click on a single photo, you would get name of the event the photo was taken at and a list of the people in the photo. These events and people are hyperlinks you can use to “pivot” to view other photos of the same event or the selected person.

After clicking a photo from the collage, you see the Single Photo View

If you select a person, you will see their profile page, shown here.

A a user's profile, shown here using Carmela Soprano as an example

Lastly, there’s a news page which shows all the recent activity:

WHAT: An alarm clock that wakes you up with the smell of cooking bacon instead of a buzzer.  The aroma wakes you up, then you can open the oven component and eat the bacon itself.

WHY: Everyone hates to be jarred awake by noise, but that’s what nearly every alarm clock does (even your favorite music or radio can be jarring first thing in the morning). This clock gently wakes you up with the mouthwatering aroma of bacon, just like waking up on a Sunday morning to the smell of Mom cooking breakfast…unless you keep kosher (sorry, Rabbi!).

USE: Just put a couple strips of  pre-cooked bacon on a paper towel in the teflon cooking tray the night before, and set the Cook Time for 4 minutes.  The bacon can be left out overnight with no problem since most of the moisture has been already cooked out of it, and there’s no preservatives besides the fact that it is salt-cured and smoked like all bacon is.  Set your alarm for 7am and by 7:04 your bedroom is filled with the strong aroma of cooking bacon.  You can then use the included tongs to pull out the cooking tray and eat the bacon without getting your fingers greasy.  Before I discovered pre-cooked bacon, I used frozen strips of raw bacon to keep them from spoiling overnight and cooked them at a longer cooking time.

HOW:  First, we hacked a cheap alarm clock.  When the alarm goes off in an alarm clock, the clock is sending a signal in the form of a wavelength along a wire to a small speaker to generate the alarm sound.  We cut that wire and re-routed it to a pin on a microchip, and programmed that microchip to respond to that particular wavelength input by triggering a relay (essentially an on/off switch) to send power to a pair of halogen lightbulbs that safely heat the bacon to a crisp.

featured in/on

ABC’s Shark Tank

Try clicking the following buttons:

• Get Cash
• Deposit Money
• $100 Cash (Shortcut)

ATM Demo

Interface Notes

Apple’s Spotlight technology is great for two primary reasons: first, it is so tightly integrated with the OS that it’s index is always up to date, and when it performs searches, it considers not just content, but also metadata. While the degree of search is unparalleled for desktop search, there are improvements to be made with regards to the user experience.

Currently, there are two search result lists: one is a summary list that immediately appears below the corner search field, and the other is a more detailed list that appears once a user hits “return” after their search text.

The two search result lists that appear when searching the term "home"

The purpose of the short list is to give a quick, simple answer for the user in a hurry who expects to find their quarry with little fuss, and the larger window is a more detailed result set for a more involved search, but the results are organized in an entirely different way. Instead of presenting the same result list in two different places with two different interfaces and wildly different organization, I would prefer to utilize a single result list. This redesign has three goals: to satisfy both the quick and dirty and more rigorous search situations described above, to provide context for the search result, and to more strongly adhere to the OS X interface standards to provide familiarity to the user.

A combination of both text search and hierarchical organization is an excellent place to start. We already see this in iTunes and Mail, where as-you-type searching with contextual filter buttons have been added to an already solid file hierarchy. Both Mail and iTunes have an advantage with regards to search because the resulting files are all the same type (email or music files, respectively).

In the case of system-wide search for Spotlight, context is key. The initial window of Spotlight provides search results based on word matching, and the context is supplied by the continuously adjusting categories as more search results stream in. This jerky behavior is frustrating because the user can’t expect a particular result to remain in place. Additionally, no context beyond “kind” is provided in this interface. To get context, the user must hit ?return? and interpret a new interface. This “extended” search results interface provides context initially only by showing the date and time the file was created (incidentally, I believe that if only one date is provided, the date modified is more useful then the date created). To get more context, the user must either choose a sorting mechanism from the right side choices or click the “i” information icon. The information icon (notably a non-standard OS X UI element), behaves like a disclosure triangle and provides the data usually associated with the “get info” command: the dates the file was created, modified, and last opened, and file size, location path, and a preview. The preview is sometimes useful (graphics, pdfs) but oftentimes, it just shows a large icon for that filetype (mail messages, any kind of text file other then pdf). In short, the supporting information that is useful to put a filename match in context is dependent on the user going the extra step to choose a sorting filter and/or uncollapsing the info icon, and even this information is often non-essential (file size? filetype icon?) to the user. In addition, of the fourteen categories Spotlight can search, only about three categories (if they contain 5 or more results) and one image preview can fit vertically on a monitor at one time at 1024×768 screen resolution, meaning that the user must scroll to see other category results.

A solution to the these issues is to borrow from the improvements made to the Finder in Panther, namely using a source column to show every category Spotlight searches. The sources here are all fourteen types of media that Spotlight searches, organized into logical clusters and topped by an “All” choice. Each source that contains results will show the number of results it contains alongside the source name. The benefit is similar to that of an RSS reader: the user is presented with a non-moving, consistent list of channels to choose from. This list also serves to impress upon the user all the different media that Spotlight can search, extending it’s usefulness as a service. Assuming that three times out of four a user will know the media type they are seeking, they will be able to immediately click the category they want to get their results. [Additionally, because Spotlight clusters many user-authored files from different applications into “Documents”, the user can also choose to add a specific filetype (such as Maya or Flash for example) to the source list.] This interface also allows the user to scan a much longer list of search results, without having to scroll.

The results list of files will have columns of Filename, Path (last two directories) and Date Modified that are sortable and can be re-arranged. Additional columns such as Author, Date Created, Last Opened, Size, etc. can be added through Spotlight preferences. When a user re-sorts their results, a fluid re-arrangement animation moves the files to their new position in the list to provide visual continuity. Along the top of the window are filter buttons similar to those found in iTunes’ search and Mail’s search. Here, these buttons allow a user to specify the location of their search: Computer, Home, mounted volumes, or a specific folder a user has chosen. These considerations eliminate the need for the visually overwhelming filter criteria to the right of the “extended” results window in the current implementation of Spotlight, and provide the user with familiar interface elements with which to filter their results.

At the bottom of the results list, there is a preview pane similar to the preview pane found in Mail and the preview column in the Finder. Here, a user can see a thumbnail of an image or pdf, watch a video, play an audio file, or read the first lines of text of an email or text file. [In Spotlight, the only preview available for a text file such is an enlarged icon of the application associated with it. This is also true in the Finder, except when looking at a .txt file, where a preview of the actual text is shown. I would like to show the actual text for any text file in this redesign of Spotlight.]

While I’m at it, why not make a few improvements just for the sake of user delight?

The current method of summoning Spotlight is great — the key combination shortcut is a satisfying nod to “power users” while the clicking of the logo or choice to use an F key makes perfect sense for everyone else. However, I would like to leverage the spotlight metaphor to bring up the search field and the following search results.

The idea is this: once a user summons spotlight, the screen dims (similar to Exposé) and a roving searchlight careens into a corner of the screen to illuminate a search field that looks to have appeared out of nowhere (see demo below). Once the user types in his/her search text and results begin to come in, the spotlight pulls back to reveal that the search field is the search field for the search results window. This way, there is a single search field a user has to keep track of, opposed to the two in the current implementation (more on that later). The results window contains a list of search results, and will behave like a window of a common application, meaning that a user will be able to apple-tab to and from Spotlight. The current behavior of Spotlight is that it belongs to no other application and the window can only be brought forward by repeating the spotlight summoning command. For users used to toggling windows by using the apple-tab key combination, it is frustrating that one application cannot be brought forwards like any other application.

With this proposed redesign, familiar interface elements are used to improve search by providing intuitive filtering and context for the exhaustive search results Spotlight delivers.

by Matty Sallin and Greg Trefry

WHAT: A biofeedback lamp that detects and “echos” your own heartbeat in realtime. Just place your hands on either side of the lamp base and wait for it to detect your pulse, then watch as it throbs to match your heartbeat. The light is hypnotic, and you can actually watch your pulse slow down by focusing on the light and relaxing.

WHY: We wanted to take an unconscious aspect of our body and amplify it so that it was visible and even controllable. For something which is usually unnoticed and very private, it is a unique experience to share your heartbeat with whoever else is in the room.

HOW: We used a circuit board for an OEM heart rate monitor designed to be integrated with exercise equipment. When a user makes hand contact with the conductive metal attached to the circuit board, the electrical impulse of their heart muscle contraction is detected and amplified by the circuit board, and a digital 5V square pulse is sent to our PIC microchip. The PIC chip in turn sends a series of MIDI commands to a MIDI-controlled light board, which powers the lamp bulbs.

by Matty Sallin with David Herman

WHAT: ChitChat is an installation that projects a speech bubble above your head as you talk. The bubble swells with the text “blah bu blah blah” as you continue to talk. The output text reflects your volume by changing size. Textual attributes such as bold text and italic text also shift to reflect voice pitch. If you or friend remains silent, they will eventually get a corresponding thought bubble.

WHY: In social situations where you mix with people you don’t know well, most of us scramble to find topics of common interest (“nice weather, eh?”). This is small talk, and there are varying degrees of focus and relevance, but often both parties are aware that the dialogue is forced and this prevents it from gaining depth. I wanted to make this humorously explicit with the assumption that everything said at this installation is small talk.

Exhibited at

Featured on

WHAT: A pair of networked photo frames that indicate the remote presence of the person in the photo. For example, if my sister in California moves around in front of her photo of me, my photo frame of her will gently flicker and light up here in New York, and vice-versa.

When my sister in California stands in front her photo of me...	...my photo of her in my New York apartment flickers like a firefly.
And when I stand in front of my photo of my sister...	...her photo of me lights up.

WHY:
The goal was to provide a means of ambient notification that a loved one is present, similar to noticing a friend walk by your window or noticing a friend is online in a Chat application.

HOW:
Each picture frame has an embedded motion detector, as well as an internet connection. When my sister walks by her frame, a motion detector is activated, and a signal is sent out through the internet. My frame immediately receives this signal from my sister’s frame, and it lights up a series of LEDs that illuminate a frame design laser etched into the glass.

featured on

At the heart of this problem is the way email clients strive to preserve the inviolability of the single message. Email clients are message-centric. Each and every single message is another document in the great stack, and you as a user are expected to deal with your correspondence in this manner. What I am proposing is a model that is conversation-centric. What I mean by this is that it is useful to think of your inbox as a collection of voices, rather then individual messages. I’m proposing a model where the most recent message is presented as the latest utterance of the sender, who resides in a list of contacts, and whose position in the hierarchy of contacts is determined by the arrival time of their latest message.

To see the value of a voice-centric model, all you need to do is to divide the number of messages in your inbox by the number of senders, or better yet, the number of unique senders regardless of multiple email addresses. In my inbox I have a staggering 782 messages of varying status: unread, partially read, fully read, and responded to. Compare that to the number of email addresses they were sent from (245), or better yet, the number of unique senders (216), and now you have 216 conversations to monitor rather then 782 messages to keep track of. That?s a reduction of 73%.

I am proposing a new interface to take advantage of this idea.

In this design, the first thing to notice is the three big buttons across the top of the screen.  These let the user can toggle between three views of their inbox: Messages, Threads, or the new Conversations.

Each line item in Conversations can be thought of as a channel that features all the messages you’ve received from that person or people.  The list is ordered by whomever wrote to you most recently; for example, the top three conversations are the last three people who wrote to you. A dot appearing next to a conversation indicates there are unread messages in that conversation.

Try it out for yourself with this PDF demo (the top three buttons are clickable) and toggle between Conversations, Threads, and Messages to see how the interface changes.

Sogetsu.or.jp is the first site I designed as a creative director. The Sogetsu Foundation is the most avant-garde school of Ikebana in Japan, Ikebana being the Japanese art of flower arrangement. The client was intentionally vague on the brief, only saying they wanted an imaginative design that was only dimly related to ikebana, and not to be too literal.

The "flower" is saturated until the user mouses towards the navigation

To echo the creative spirit of Sogetsu, I used Flash to dynamically create an abstracted “flower” out of geometric petals. Whenever a user comes to their homepage, they are greeted with a flower of unique shape and color.

Once a user moves towards the flower, the saturation dims to not distract from the content. The six menu items are attached to the tips of the petals, and when a user clicks one, the petal expands to form a polygon of sub-navigation. After the user chooses what they wish, the petal further transforms into the desired content pane.

Visit Site

Note: This design is offline but I have restored most of it with my own files at the link above. All dynamic content was dependent on the Sogetsu database, so there are some empty pages…