Увага! Триває збір коштів на сплату оренди серверу для проекту!
Зібрати плануємо приблизно 1000 грн. Деталі за цим посиланням

CONCEPTUAL DESIGN FOR INTERACTIVE SYSTEMS / КОНЦЕПТУАЛЬНИЙ ДИЗАЙН ІНТЕРАКТИВНИХ СИСТЕМ: Chapter 1: A Multiple and Cross Channel Example: Setting an Appointment

Оригінал англійською Переклад українською

In order to illustrate the fundamental components of the conceptual model, we introduce and analyze four existing calendar applications. Each of the four applications supports setting an appointment and each is on a different interaction channel. Such a comparative illustration can demonstrate how you can achieve the same goal using different conceptual models.

#1

The first step in the interaction flow is common to all four applications: In order to set an appointment, the user can select a starting date and time by pointing at it on the calendar or by activating an option for setting a new appointment. The illustration of the conceptual model starts here after this initial step by looking for what comes next. For the four applications, we will use the following tasks:

#2

1. Defining the basic of the appointment: topic, place, date, and time.
2. Setting a reminder for the appointment.
3. Setting the appointment as a recurring one.

#3

The sample calendar applications are on the following four interaction channels:

#4

1. Desktop Windows
2. Web-based
3. Tablet
4. Smartphone

#5

The following is a detailed description of the interaction with each of the applications.

#6

The first application for setting an appointment is a well-known Windows-based program typically installed on desktop and laptop computers with a familiar graphical user interface (GUI). In the Calendar user interface, the user can perform these tasks in the very first tab is "Appointment" (Figure 1.1). Notice where and how the user performs each of the following tasks in the GUI:

#7

1. Setting the basic appointment parameters: text fields to specify the subject and location of the appointment, in addition to a couple of controls to specify the date and time of the appointment.

#8

2. Setting a reminder: a pop-down list to select the lead time for the reminder.

#9

Figure 1.1: A Windows-based GUI application for accomplishing the goal of setting an appointment.

#10

3. Setting a recurrence: includes parameters such as the appointment time, recurrence frequency, and recurrence range of dates.

#11

The second application is a Web-based calendar. As was the case in the Windows-based application, the interaction flow in this application also allows for starting from a specific time slot in the calendar in which case the date and time are already set based on the starting point (pop-up modal window 1 in Figure 1.2). The user can

#12

1. set up the basic appointment parameters at the top right corner of the page,
2. set a reminder by moving to another place on the page and opening a pop-down list of reminder lead times,
3. set a recurrence by opening of a pop-up modal window, which includes the recurrence frequency and additional parameters.

#13

The third calendar application is for touch tablets. As with the two previous applications analyzed above, after the interaction starts with the calendar, a dialog box pops up on the screen (1 in Figure 1.3). The user can:

#14

1. define immediately and directly at the top of the window the title (purpose) of the appointment and its location;
2. set or edit the date and time of the appointment, a new pop-up modal window appears on top of the previous one, in which the date and time can be set (dismissing the second pop-up and returning to the original main window for setting an appointment conclude this extended interaction);
3. set a reminder opening another pop-up modal window in which the user selects the reminder lead, closes the secondary window, and returns to the main one;
4. set a recurrence of the appointment opening another pop-up modal window in which the user sets the recurrence frequency, closes the secondary window, and returns to the main one.

#15

FIGURE 1.2: A Web-based application for accomplishing the goal of setting an appointment.

#16

FIGURE 1.3: A tablet-based application for accomplishing the goal of setting an appointment.

#17

The fourth application is on a touch screen smartphone. Creating a new appointment brings the user to a dialog box that fills up the screen (1 in Figure 1.4). The user can:

#18

1. define the subject and location of the appointment at the top of the screen, available and visible immediately (the date and time of the appointment are also at the top and available immediately for interaction);
2. set or edit the date of the appointment by opening a small pop-up modal window on top of the appointment screen, but living it visible in the background;
3. set the time in a similar way to setting the date (once the parameters are set, the user can conclude this extended interaction by closing the pop-up modal window and returning to the original and main window for setting an appointment);

#19

FIGURE 1.4: A smartphone-based interface for accomplishing the goal of setting an appointment.

#20

4. set a reminder by scrolling down in the same window to the place denoted as 4 in Figure 1.4 (at this place, the user invokes a pop-up list to select the reminder lead times);
5. define the appointment as recurring in which the user scrolls further down to a place denoted as 6 in Figure 1.4 (as before, the user invokes a pop-up list in order to select the recurrence parameters).

#21

Now that we have four rather simple applications as examples, let us think about them. We know that the four applications support users in achieving the same goals: set an appointment, set a recurring appointment, and set a reminder for the appointment. Yet they look and behave differently. Why? There is an obvious answer: each application runs in a different interaction channel. The design of each application complies with the native look and feel of the respective channel.

#22

However, is that all that is different between them? Moreover, does it matter? Here is the thesis of this book: there are differences that are more fundamental, and yes, they do matter. To elaborate, we shall discuss the conceptual model and show the fundamental differences and their impact. However, before we do that, let us consider one more aspect.

#23

You probably noted that the description of the interaction flow in each of the applications treated each action as if the user "goes" to another "place." Think of "going places" metaphorically. The following sections of this primer discuss the relation between "places" and elements of the conceptual model and their relation to "physical places" such as windows, dialog boxes, and Web pages. We call this the spatial metaphor. Next, we discuss the significance of spatial metaphor and the importance of abstraction when dealing with the conceptual model.

#24

Хвилинку...