OLPC Human Interface Guidelines/The Laptop Experience/lang-ko

Most developers are familiar with the that dominates the modern-day computer experience. This metaphor has evolved over the past 30 years, giving rise to distinct classes of interface elements that we expect to find in every OS: desktop, icons, files, folders, windows, etc. While this metaphor makes sense at the office—and perhaps even at home—it does not translate well into a collaborative environment such as the one that the OLPC laptops will embody. Therefore, we have adopted a new set of metaphors that emphasize community. While there are some correlations between the Sugar UI and those of traditional desktops, there are also clear distinctions. It is these distinctions that are the subject of the remainder of this section. We highlight the reasoning behind our shift in perspective and detail functionality with respect to the overall laptop experience.

• Desktop : Neighborhood
• Menubar : The Frame
• Hierarchical Filesystem : Journal
• Applications : Activities
• Files : Objects

The mesh network is a permanent fixture of the laptop environment and is represented explicitly in the interface. A zoom is used to relate four discrete views, each of which caters to a particular set of goals: Home, Groups, Neighborhood, and Activity. Using keyboard shortcuts or controls in the The Frame, children may zoom in and out on the mesh community.

Of all the zoom levels, the Home view relates most closely to the traditional desktop. As the first screen presented to the child at startup, it serves as a starting point for the exploration of both the mesh network and also of personal activities and objects. From this view, the child may either back up first to their Neighborhood — such as their Friends or their Class — and beyond that to a view of the entire mesh , or, instead, zoom in to focus on a particular Activity.

The Home view interface is minimalistic. In the center of the screen, the XO icon—rendered in the child's user-specified colors—represents the child to whom the laptop belongs. The activity ring surrounds the character, indicating all of the currently open activities. Furthermore, the section of the ring that a given activity occupies directly represents the amount of memory that the particular activity requires to run, providing immediate visual feedback about memory constraints and exposing a means for resource management that doesn't require knowledge of the underlying architecture. Most activity management happens here: starting new private activities, ending current activities, and switching between activities.

When used in conjunction with the Bulletin Board, the Home view becomes the most direct correlate to a typical PC desktop as a place for keeping things handy: tomorrow's homework, a drawing one is working on, a favorite song, a reminder to oneself to do one's chores, etc.

The Groups view takes a small step back from the child's Home space, opening up to include their circle of friends, their classmates, and any other groups to which a child belongs. The Friends group essentially represents a spatially viewable and editable buddy list. From here the child can add or remove friends and move individuals around, perhaps arranging them logically. The Class group is defined dynamically, and includes all others in the same class, and their teachers as well. This group provides the perfect space for working and sharing with classmates, posting projects for class critique, or for picking up the homework assignment the teacher posted to the class Bulletin Board.

In additional to several special classes of groups, children may also generate groups on their own. This might provide a way for a close group of friends to keep up with each other's activities, or for a group of aspiring photographers to share photos. In a classroom setting, this provides a way for the children to create temporary groups for working on classroom exercises, or long term groups for extended projects. To create a group, a child can search for or select any number of individuals on the mesh. Each of these individuals will receive an invitation to join the group, and upon accepting the invitation will have the its name added to their list of Groups, where they can see and chat with members, and post to the group Bulletin Board. Although one person initially creates a group, groups are not managed. Instead, people may choose to leave a group on their own, and anyone in the group may invite other members into it. When this happens, all current group members receive introduction notification, making them aware of the new member. This open model simplifies the interaction and encourages the learning of natural social dynamics instead of attempting to enforce them via rules and restrictions.

Groups have several advantages. First, it allows the children to view their friends, classmates, and other groups, and allows them to freely chat with them as well. Additionally, each group will have its own private Bulletin Board where members can post notes and share Objects. Finally, all of the members of the selected group — a child's friends, for instance —receive invitations whenever the child starts an activity from the Groups view, making collaboration implicit. Moreover, this view allows the child to see what activities their class, friends, and other groups are presently engaged in, providing the opportunity to join any non-private activities. Already, you can see how this view changes the usual method of application launch, allowing one to start new networked activities or join existing ones directly.

Zooming out one more step we reach the Neighborhood view. Here children can see everyone on their local mesh. At this level we intend to support a variety of views, each with a different focus: the individuals; the activities in which they are presently engaged; etc. In the figure, individuals are shown clustered around their currently active activities, providing a direct visual representation of the popularity of an activity, since group size is immediately perceptible.

While the Neighborhood view doesn't currently provide any true spatial or geographical data, it does provide an at-a-glance social geography of the mesh and its participants. Similar to the Groups view, launching an activity here implicitly opens that activity up for anyone in the Neighborhood to join. While no one receives an explicit invitation in this case, the newly started activity will appear in the view, with its participants clustered about it, so that anyone who wishes to may join. Of course, this also means that the Neighborhood provides an excellent space for exploration. Here, one can both search for, locate and join activities of interest using a powerful and adaptable search technology, and also interact with and make friends with other children in their neighborhood they haven't yet met.

Zooming in from the Home view, a child finds the Activity view. This view contains the activities where all of the actual creation, exploration, and collaboration takes place. This is where you, the developer, come into play, providing new and engaging tools, extending the functionality and encouraging new types of creative exploration.

Though multitasking has become somewhat of a standard in today's desktop computing world, we've chosen to break away from this model, instead adopting a fullscreen activity view that focuses the children's energies on one specific task at a time. Although one may have several activities open in the activity ring at any given moment, only one can be denoted as the active activity (similar to focus in a window system). Several factors contributed to this decision: first, although the laptops have an extremely high-resolution display—200dpi—the actual viewing area remains quite small—a modest 7.5-inch diagonal—leaving little room for multiple activities on the screen; second, as noted, it naturally focuses efforts on a specific task. The Frame detailed below serves as the interstitial tissue between activities. As a visual extention of the Journal, it enables objects to move between activities.

For extensive detail on the various aspects of the activity interface and their design guidelines, see the Activities section.

Glancing at the previous screen shots, you might have noted the absence of a menu bar or other form of persistent interface element. Such a persistent element reduces the screen space available for activities; since screen is at a premium, we have opted to use a frame—always on the periphery and just out of sight—to contain all of the peripheral information that a child might need, across all views. Since the Frame persists at all zoom levels, it provides a consistent place for those interface elements which apply to all views, including search, incoming invitations and notifications, a clipboard, and buddies you are currently interacting with.

When activated, the Frame slides in atop the currently visible view, providing access to needed functionality, yet quickly retracting from view once the task for which the child invoked it ends. Although these transitions happen quickly, a forgiveness parameter prevents unintentional Frame retraction in hopes of making interaction with this interface element completely natural.

At a high level, one can consider the frame in two parts: The left, top, and right sides of the frame represent nouns: things, places, and persons. The bottom of the frame represents those elements that require action: activities, invitations, and notifications. More specifically, each edge of the frame is dedicated to one of people, places, objects, or actions.

As previously mentioned, the presence of others on the mesh defines much of the laptop experience. In order to surface this at all times in the interface, the right-hand edge of the Frame provides an easily accessible list of all the individuals a child is collaborating with in the currently active activity, represented by their colored XOs. This has a number of benefits. First, it provides a quick reference of the people the child is working with, which updates as new people join and others leave. As new people arrive, they appear in the upper right corner, and as they leave they simply vacate their current location. Additionally, the secondary rollovers for these XO objects reveal biographical information about them: name, age, class, interests, and even a small photo. This makes the frame a great resource for meeting new friends, for what better place to meet them than in the activity shared with them?

Of the various frame components, the Places category is the most abstract. However it also emphasizes the metaphors that the zoom levels build upon. In the upper left-hand corner reside the zoom buttons, which can instantly transition the user among the Activity, Home, Groups, and Neighborhood views. For clarity, the upper left-hand function buttons on the keyboard have identical icons and functionality.

On the other side of the Places edge resides the Bulletin-Board button. Again, this button has an analogous key on right-hand side of the keyboard's function keys. Discussed later, this button acts as a toggle for an auxiliary layer which can provide contextual chat and a place to share objects. This button functions within the Places bar because it acts as a modifier to any view. In a sense, it adds an additional layer of context to any other "place" on the laptop.

Finally, though not less importantly, this section of the Frame contains the global search field.

The clipboard has become a staple in any modern operating system. Nonetheless, its implementations have changed little, if at all, in decades. The clipboard has one "page", to which you can copy to, cut to, and paste from, and in most cases this hypothetical page remains invisible: to see what's on it, you've got to paste its contents. While this isn't strictly true (On Mac OSX, for instance, an item at the bottom of the 'Edit' menu allows you to 'View Clipboard Contents'), most users are oblivious about viewing its contents, as one must explicitly seek it out. This basic model, while simple, often falls short of many use cases. Thus, OLPC has extended the traditional clipboard, empowering the user with added functionality without increasing complexity.

On the laptops, the clipboard takes the form of the left-hand edge of the frame. This region serves as temporary storage for objects - a paper, an image, a sentence, a URL - facilitating their transfer among activities and, perhaps more importantly, among the various zoom levels. Any type of object that can be stored in the Journal can likewise be transported via the clipboard. A child may place an object on the clipboard in a couple of convenient ways. First, keyboard shortcuts will provide an interface for simple copy and paste functions in the way already familiar to us. Additionally, since objects support direct manipulation, the child may simply drag a photo, file, or selection onto the frame in order to copy it, and may then drag it out to paste it in another location, such as within another activity, on a friend, or to a Bulletin Board. As items are placed on the clipboard, they are arranged temporally in a push-down stack, the most recent clipping appearing in the upper-lefthand corner of the frame.

With the presence of a clipboard which contains multiple items, it becomes necessary to add a means for selecting an active clipping as the source for any paste command. Since the usual copy/paste keystrokes will quickly become familiar to all, any invocation of the copy shortcut will automatically place the resulting clipping at the top of the stack, selecting it as the source. Additional copy commands (or drags) will continue to add elements to the clipboard stack. Once the clipboard reaches a predefined limit, the elements at the bottom of the stack will begin to drop off making room for the new ones. Elements may also be removed explicitly by the user via their contextual rollover, and a modified paste shortcut for advanced users will serve to both paste an item and pop it from the stack at the same time.

The resulting clipboard will behave identically to those on current operating systems, while at the same time providing drag and drop support, clipboard history, and previews, as well as advanced functionality for advanced users.

The bottom edge of the frame functions primarily as an activity launcher, but it also accumulates both incoming invitations and notifications. As a starting point for instantiating activities, this part of the frame is fairly straightforward. Whenever an activity receives a click, a colored instance of that activity appears within the activity ring in the child's own colors, and invitations are automatically sent as appropriate. On the other hand, anytime the child receives an invitation it appears as a colored activity icon (in the color of the inviting XO, of course), clearly distinct from the uncolored outlines of the activities which reside on the child's own machine. Since an invitation to join an activity has no functional differences from starting, the invitations appropriately indicate this by their similar form. The rollover state for these invitations allows the child to accept or decline the invitation, optionally providing a reason for declining.

Notifications, the third aspect of the Actions edge of the frame, function slightly differently. While they don't represent an activity that the child can join, they do come as messages from activities or from the system, conveying important information about the state of the activity or system status such as battery strength or wireless signal. Though slightly different from activities and invitations, these notifications still require some action on the child's part, and are an appropriate addition to the frame which provides a convenient way to access them from within any view. Just as in the other edges of the frame, invitations and notifications organize by time, the most recent always in the lower left-hand corner, so that the child may handle them in a timely manner.

The Frame has multiple activation methods.

Hot corners serve as the Frame's primary invocation method. As Fitts' Law implies, the corners are the easiest part of the screen to hit with a cursor. Moving the cursor to any corner of the screen will instantly invoke the frame. From a corner, one can readily scroll along an edge in search of a desired element. Since newly added people, objects, and invitations insert from the corners, the latest invitation, clipping, or participant is always close at hand.

In addition to trackpad-based activation, the information within the Frame lies just one keystroke away. A dedicated key has two modes of functionality: (1) momentary presses act as a toggle, turning the Frame on and off with each press; and (2) holding the key down, the Frame will appear on screen until release of the key. This latter method provides a quick way to glance at incoming invitations or other system status elements for a brief moment and then return full focus to the activity view itself.

Though rare, some urgent notifications such as low battery levels may override the Frame, automatically bringing it into view without user interaction. These overrides come from the system only; applications do not have privileges for override, although they may alert the user via standard notifications.

[edit] 게시판

모든 뷰에서 게시판은 대화와 공유를 위한 도구입니다.

Bulletin boards provide a layer for contextual chat and sharing around any view.

이 노트북은 메쉬 네트워크를 통한 연결을 언제나 유지하므로, 이러한 이점을 살릴 수 있는 추가적인 UI 레이어가 필요합니다: 게시판. 문자 그대로, 게시판은 "어떤 내용을 게시하는" 공간입니다.

문맥은 노트북 게시판의 유용성에 결정적입니다. '프레임'의 '장소' 가장자리에 있는 버튼 하나가 게시판 레이어를 켜고 끄며, 이 기능을 수행하는 버튼은 오직 하나 뿐이지만, 여러 가지 줌 레벨에서 각각의 뷰가 자신의 게시판을 갖습니다. 어느 한 게시판에 접근할 수 있는 개인들의 범주는 해당 뷰가 현재 표명하는 개인들의 범주와 일치합니다. 가령, '홈' 뷰 게시판에 게시된 모든 아이템은 그것을 게시한 아이에게만 보이므로, 전통적인 데스크탑 환경을 효과적으로 제공합니다. 마찬가지로, 그 아이의 '친구' 목록에 포함된 어떤 아이든, 그 아이가 '친구' 뷰 게시판에 게시한 것을 볼 수 있으며, 학급의 학생들과 교사는 '교실' 게시판에 게재된 것을 볼 수 있습니다; '메쉬' 뷰 게시판은 노트북 공동체 전체가 공유하는 환경을 제공합니다. 나아가, 각각의 활동 역시 그 자체 게시판을 가지며, 그 활동 자체에 관련된 파일과 아이디어를 공유하는 공간을 제공합니다.

[edit] 공간적 채팅 인터페이스

WTF? What kind of title is this??

모든 뷰 상의 투명한 레이어로, 게시판은 공간적인 문맥 채팅 인터페이스를 제공합니다. 이것은, 일시적으로 조직되는 전통적인 포럼 스타일 스레드와 달리, 채팅 버블이 스크린의 어디에든 위치할 수 있음을 의미합니다. 바다 그리기에서, 예를 들면, 하나의 대화가 수면 아래에서 진행되고, 동시에 또 다른 그룹이 하늘을 나는 새의 그림 형태에 대해 이야기할 수 있습니다. 또 다른 상황으로, 한 어린이가 먼 곳에 있는 다른 아이가 어떤 새로운 활동을 이용하는 방법을 익히는 것을 도와줄 수 있는데, 특정한 인터페이스 요소들을 그 기능에 대해 자세한 설명을 제공할 수도 있습니다. 읽기 응용프로그램에서, 교사가 아이의 글짓기를 보고, 맞춤법에 어긋난 부분을 지적하고, 활동 레이어 상의 작업을 직접 편집하지 않고도, 아이가 쓴 글의 특정 부분에 관해 의견을 나눌 수 있습니다.

[edit] 공유를 위한 환경

문맥적 채팅에 더하여, 게시판은 공유 공간을 제공합니다. 게시판에는 타인들이 보고, 즐기고, 다른 이들에게 전달하고, 공유할 수 있는 어떤 오브젝트도 게시될 수 있습니다. 공유 공간은 모든 뷰의 핵심 요소입니다.

'홈' 뷰에서는 해당 노트북을 소유한 아이만이 게시판 컨텐트에 접근할 수 있습니다. 여기서, 게시판은 일시적으로 오브젝트를 저장하고, 손 쉽게 접근하기 위한 편리한 공간입니다. 이러한 방식으로, 줌 레벨들로 대체된 전통적인 데스크탑은 '홈' 뷰의 게시판을 통해 다시 제 자리를 차지할 수 있습니다. 여기서 묘사되는 기능은 전통적인 데스크탑을 어느 수준까지 모방합니다. 문백적 채팅 풍선이 '홈' 뷰에서도 가능하며, "메모장" 메커니즘을 제공합니다. 게시판 메타포는 오브젝트를 두기 위한 일시적이고 항상 변화하는 공간을 강조하며, 오브젝트를 저장하는 공간과는 구분됩니다. 이것은 데스크탑을 "모든 것"의 저장 장소로 오용하는 것을 막을 수 있으며, 따라서 어느 한 시점에 가장 요구되는 파일들을 쉽게 찾을 수 있도록 합니다.

'친구'와 '메쉬' 뷰에서, 게시판은 아이가 발견하거나 친구들과 만든 재미난 것들을 공유하는 공간입니다. 공유와 더불어 기억해야 할 중요한 사항은, 물론, "철수, 영희와 이 JPEG (또는 다른 파일 포맷)을 공유"하는 것이 아니라, "철수, 영희와 이 사진 (또는 그림)을 공유"하는 것입니다. 공유 메타포는 우리가 이용하는 파일 전달 시스템보다 훨씬 자연스러운데, 파일 전달은 사실상 공유의 보다 추상적 아이디어를 기술적으로 수행하는 것을 의미하기 때문입니다. 물론, 어린이들 역시 다른 사람들이 게시한 것들을 볼 수 있습니다. 더욱이, 공동체 공간으로서, 그룹 공유가 자연스럽게 발생합니다.

마지막으로, 게시판의 공유 공간은 '활동' 수준에서 약간 상이하지만 더욱 강력한 의미를 가집니다. 즉, 현재 뷰에 대한 문맥적 상황에서, 각각의 ㅎ활동은 그 자신의 공유되는 게시판을 가집니다. 이 레이어에 게시함으로써 해당 활동에 참가하는 다른 이들이 볼 수 있는 기저의 활동을 위한 지원 자료를 제공할 수 있습니다 (또는, 원한다면, 그들 자신을 위해 간직하거나). 이것은 사실 굉장한 것인데, 해당 활동 그 자체는 지원하지 않는 많은 오브젝트들을 포함하여, 어떤 오브젝트든 이런 식으로 공유될 수 있기 때문입니다. 예를 들면, 그림 속에 노래를 붙여 넣을 수는 없지만, 게시판에 게재된 노래는 그것에 대한 영감을 제공할 수 있습니다. 비슷하게, 이것은 해당 활동 내에서 당면한 과제에 관련된 자료 수집 수단이 될 수 있습니다. 5명 각각이 상어 이미지를 직접 그림에 게재하기보다는 그림을 위한 토대로써 어떤 것을 이용할 지 결정 하기 전에 다른 사람들이 보고 논의할 수 있도록 게시판에 그것을 게재할 수 있습니다. 그러므로, 게시판은 연구를 모으고, 자료를 지원하는 공간이며, 그것들과 활동을 둘러싼 논의의 장입니다.