Usability Study

We undertook a Usability Study of the Kevlar system, the feedback of which was used to make improvements to the product.

The original Usability experiment page can be found here. Reproduced below are the tasks users were encouraged to complete using Kevlar.

Instructions

• One task leads onto another, so please do not close Kevlar or start a new canvas between each task unless instructed to.

Task 1

Aim

Get a list of files in your current working directory. Learn how to navigate in Kevlar and learn the different ways of getting at programs.

Steps

First we want to create a pipeline with one program that lists the contents of the current directory.

• Locate the programs pane on the right and open it.
• Click on 'FileUtils'.
• Click and drag 'List-Files' onto the canvas.

Now we want to connect this program up with another program to show the output of 'List-Files'.

• Click in the middle of the screen and type 's'.

This brings up the 'find-programs-as-you-type' window. 'Show' if you now press 'h', 'Show' will be the only program. Press enter to select it.

• Press enter to select 'Show' which will add it to the screen.
• Click the 'Data' node of 'Show' and then click on the 'Filenames' node of 'List-Files'.

A pipe linking the two programs should appear.

• Press the play / run button on the toolbar
• Or press Ctrl+Enter together to run the pipeline.

Correct Result

The show pane at the bottom should change to yellow. Click the arrow to expand the window and see the contents of the current directory.

Task 2

Aim

To save the pipeline made in task 1.

Steps

If you did not complete task 1. successfully, please still attempt this task as though you had.

First, we want to open the 'Save Pipelines' panel.

• With the task pane on the right open, click the small arrowhead at the top right.
• Click 'Save Pipelines'.
• Or, click the save icon in the toolbar.
• Choose a directory to save the pipeline in and remember it.
• Type in a name and click save.

Correct Result

The file will appear in the directory that was saved to.

Task 3

Aim

To load the pipeline saved in Task 2

Steps

If you did not complete task 2. successfully you may skip this task

• Click the 'new' button, the first button on the toolbar.
• Open the 'Load pipelines' panel
• Navigate to where you saved the pipeline in task 2.
• Click on the thumbnail.

Correct Result

The pipeline saved in task 2 will be loaded and the programs will appear on the canvas.

Task 4

Aim

To search for programs and use program arguments. We want to list all files that have the letter 'a' in their name.

Steps

We are going to search for a program that filters out text that does not match a given pattern. Under Linux, there is another program to do this called "grep".

• Open the 'Search' panel.
• Type in 'grep' and press 'Search'.

One program should appear called 'Text-Search'. If you click on that program, help about it should appear.

• Drag and drop this program onto the canvas
• Add a 'List-Files' program and a 'Show' program to the canvas too.

We want to connect 'List-Files' to 'Text-Search', then 'Text-Search' to 'Show'.

• Connect List-Files's 'Filenames' to Text-Search's 'In'.
• Connect 'Text-Search''s 'Out' to Show's 'Data'.

If you run this pipeline, nothing should appear in the show pane. That is because we need to set a pattern for Text-Search. Note that the pattern '.*a.*' means: Contains an 'a'. '.*' means: match anything.

• Set the 'pattern' argument of 'Text-Search' to '.*a.*'. Do this by clicking the argument and typing in the box that appears.
• Run the pipeline

The output panel at the bottom will now list files in the current directory that contain the letter 'a'. Note you can change the current directory using the Directory panel. (Ctrl-D to bring up)

Notice that the output pane tab is called "Text-Search". This is because 'Show' is connected to 'Text-Search'. This could be set to something more useful. To change the name, we need to add an argument to 'Show'.

• Click the black bar at the top of 'Show' to bring up options
• Click the '+' button on 'Show'.
• Select 'Name' from the list of arguments
• Change the 'Name' from "Default" to "A Files".
• Run the pipeline

Correct Result

The output pane contains a tab called "A Files" and lists files with the letter 'a' in them.

Task 5

Aim

To use arguments to change nodes of programs. To build a pipeline to list the contents of just the first sub-directories of the current directory.

Steps

If you did not successfully complete Task 4. you may skip this task.

Continuing with the pipeline from Task 4...

• Change the 'Directories-Input' argument of 'List-Files' to a tick by clicking it.

Notice a new input node appears on 'List-Files' called 'Directories'.

• Create a second List-Files program.
• Create a connection (A pipe) from the new List-Files program's output into the 'Directories' input of the other List-Files program..
• Run the pipeline

This pipeline works by getting the directories in the current directory, and then using another listfiles to get the files and directories in those directories.

It is even possible to connect listfiles to itself to find all sub-directories.

You can use the 'Directory' pane to set the current directory. Press Ctrl-D to bring this up.

Correct Result

The output pane contains a tab called "A Files" and lists files with the letter 'a' in them from immediate sub-directories of the current directory.

Task 6

Aim

To build an advanced pipeline that takes images in a directory, resizes and rotates them, and shows the before and after images.

Steps

Start with a new canvas, by clicking the 'new' button. (First button on the toolbar

• Press Ctrl-D to bring up the Directory selector.
• Please select a directory on the computer with about 2 to 10 images

Attempt to build a pipeline that:

• Lists all files in the current directories
• Loads the filenames as images
• Uses the 'Junction' program to feed the images into two different programs
• Shows the images as they are originally
• Resizes the images to 100 by 100, rotates them by 90 degrees and shows what they would look like.

You will need these programs:

• List-Files: Get the filenames of images.
• Image-Loader: To convert the filenames into images. It will ignore non image filenames.
• Junction: To take the images and allow it to be fed into two other programs.
• An Image editing program : To Resize the image, then another one to rotate the image. Please search for a program that can do these tasks.
• Show: To display the images as they were before editing, then another to display the images after they have been resized and rotated.

• Run the pipeline

Note that List-Files should feed into Junction, and Junction should feed into both Show and Image-Edit.

Correct Result

The last image from the directory will show in both output panel tabs, first as the original image, and resized and rotated in the other tab.