Graphical User Interfaces

1
Quiz, 10 questions
point

1.
Answer the following questions about speed-dependent automatic zooming.

Which is the correct equation that represents the relationship between speed and
mouse displacement (d) in the revised implementation of speed-dependent
automatic zooming?

Hint: refer to the original paper if necessary.

speed = constantd

speed × d = constant

speed × const1 = d + const2

d − const1 = const2 × log(speed)

1
point

2.
The following pseudo-code with blanks [1] ~ [5] represents the core part of the one-
dimensional scrolling function in speed-dependent automatic zooming technique.

Select the correct correspondence of code fragments (A) ~ (E) to the five blanks.

Note that "s0", "d0", "d1" and "v0" are constant values described in the lecture video,
and "scale" and "scroll_positions" are global variables to be controlled by the
function. abs(x), pow(x, y) and sign(x) are mathematical functions which calculates
absolute value of x, x to the power of y, and the sign (1 or -1) of x, respectively.

Pseudo-code

1 function scroll(mouse_position, drag_start_position) {

2 [ 1 ]
3 [ 2 ]
4 [ 3 ]
5 [ 4 ]
6 [ 5 ]
7 }

Code fragments

1 (A) scale = pow(s0, (dx-d0)/(d1-d0))

2 (B) scale = max(s0, min(1.0, scale))
3 (C) scroll_position += speed
4 (D) dx = abs(mouse_position - drag_start_position)
5 (E) speed = v0 / scale * sign(dx)

[1] D [2] A [3] B [4] E [5] C

[1] A [2] B [3] D [4] E [5] C

[1] A [2] D [3] E [4] B [5] C

[1] D [2] B [3] A [4] C [5] E

1
point

3.
Answer the following questions about the Bubble Clusters system.

Suppose that we have a potential field that comprises two kernels.

The potential field generated by a kernel located at c is given as a function of position

p: h(p) = 200 − ∣p − c∣, and the two kernels are located at c1 = (200, 200) and
c2 = (400, 200).

What is the shape of the area (bubble) that satisfies h > 100?

Hint: refer to the original paper if necessary.

 1
point

4.
Which of the following pseudo-codes represents the clustering and visualization
algorithms of Bubble Clusters correctly?

1 clusters = clustering(icons)
2 foreach (cluster in clusters) {
3 potential_field = calculate_potential_field(cluster)
4 contour_lines.add(marching_squares(potential_field))
5 }

1 contour_lines = calculate_contour(icons)
2 foreach (contour_line in contour_lines) {
3 potential_field = extract_cells_inside_contour(contour_line)
4 clusters.add(make_a_cluster(potential_field))
5 }

1 potential_field = calculate_potential_field(icons)
2 contour_lines = marching_squares(potential_field)
3 foreach (contour_line in contour_lines) {
4 clusters.add(make_a_cluster(contour_line))
5 }

1 potential_field = calculate_potential_field(icons)
2 clusters = clustering_by_potential(potential_field)
3 foreach (cluster in clusters) {
4 contour_lines.add(calculate_contour(cluster))
5 }
 1
point

5.
Answer the following questions about the Ninja Cursors system.

Consider a 1D desktop with three icons that occupy regions [100, 120], [200,220], and
[300,320], where the mouse cursors are located at x=90, x=180, and x=270,
respectively.

Suppose that the mouse moves the cursors by +1 pixel per second (if they are not
blocked). How long does it take for a cursor to enter the third icon?

Hint: refer to the original paper if necessary.

10 s

30 s

50 s

70 s

1
point

6.
The following pseudo-code represents the process to move cursors according to the
user input (movement of mouse) in Ninja Cursors.

Answer the correct combination of code fragments to fill in the blanks [1] ~ [3].

Assume that mouse movement is small and any cursor does not go out of an icon
and enter another icon a once.

Pseudo-code

1 queue = new Queue()

2
3 function mouseMoved(mouse_movement) {
4 foreach (cursor in all_cursors) {
5 if (cursor.position + mouse_movement is in any icon) {
6 if (queue.contains(cursor)) {
7 if ([ 1 ] == cursor) {
8 cursor.position += mouse_movement
9 }
10 } else {
11 [ 2 ]
12 }
13 } else {
14 if (queue.contains(cursor)) [ 3 ]
15 cursor.position += mouse_movement
16 }
17 }
18 }

Code fragments

1 (A) queue.push(cursor)
2 (B) queue.top()
3 (C) queue.delete(cursor)

[1] A [2] B [3] C

[1] A [2] C [3] B

[1] B [2] A [3] C

[1] B [2] C [3] A

[1] C [2] A [3] B

[1] C [2] B [3] A

1
point

7.
Answer the following questions about the Flatland system.

Assume a behavior that applies the following method to the input strokes (lambda
and theta are constant values).

1 function addInputStroke(Stroke stroke) {

2 foreach (Point p in stroke.points) {
3 p.x = lambda * cos(theta) + p.x
4 p.y = lambda * sin(theta) + p.y
5 }
6 segment.addPaintedStroke(stroke)
7 }

Which statement describes the effect of this behavior correctly?

Hint: refer to the original paper if necessary.

Shrink the incoming strokes.

Enlarge the incoming strokes.

Move (shift) the incoming strokes.

Rotate the incoming strokes.

1
point

8.
Assume a behavior that applies the following method to the input strokes (dx is a
constant value).

1 function addInputStroke(Stroke stroke) {

2 Stroke stroke2 = new Stroke()
3 foreach (Point p in stroke.points) {
4 Point p2 = new Point(p.x + dx, p.y)
5 stroke2.points.add(p2)
6 }
7 segment.addPaintedStroke(stroke)
8 segment.addPaintedStroke(stroke2)
9 }

Which statement describes the effect of this behavior correctly?

It translates the input stroke.

It scales the input stroke.

It rotates the input stroke.

It makes a duplicate of the input stroke and translates it.

It makes a duplicate of the input stroke and rotates it.

It makes a duplicate of the input stroke and changes its thickness.

 1
point

9.
Answer the following questions about the Voice as Sound system.

Suppose that we have the spectrum [120, 110, 120, 100, 110] at time t=0 and [110,
120, 100, 110, 100] at time t=1.

Select the correct interpretation of this signal.

Hint: refer to the original paper if necessary.

The pitch becomes higher between t=0 and t=1.

The pitch becomes lower between t=0 and t=1.

The pitch remains constant between t=0 and t=1.

These data are insufficient to compute the pitch change.

1
point

10.
The following pseudo-code represents the algorithm of the pitch changing detector
of the Voice Interaction technique shown in the lecture video.

Answer the correct combination of code fragments to fill in the blanks.

Assume that prev and current store the result of FFT at previous and current time
frame.

Pseudo-code

1 function detectPitchChange(double[] prev, double[] current) {

2 sum_low = 0
3 sum_high = 0
4 for (i=1; i<prev.length-1; i++) {
5 sum_low += [ 1 ]
6 sum_high += [ 2 ]
7 }
8 if (sum_low > sum_high) {
9 return PITCH_GETS_LOWER
10 } else if (sum_low < sum_high) {
11 return PITCH_GETS_HIGHER
12 } else {
13 return PITCH_DOES_NOT_CHANGE
14 }
15 }

Code fragments

1 (A) prev[i] * current[i-1]

2 (B) prev[i] * current[i+1]
3 (C) (prev[i] - current[i-1]) * (prev[i] - current[i-1])
4 (D) (prev[i] - current[i+1]) * (prev[i] - current[i+1])
5 (E) (prev[i] - current[i-1])
6 (F) (prev[i] - current[i+1])

[1] A [2] B

[1] B [2] A

[1] C [2] D

[1] D [2] C

[1] E [2] F

[1] F [2] E

I, Aditya Dev, understand that submitting work that isn’t my own may result in
permanent failure of this course or deactivation of my Coursera account.
Learn more about Coursera’s Honor Code

Submit Quiz