Speedy Sketch

A Quick and Familiar 2D to 3D ModellingApplication

Author:Misha Griffiths

Supervisor:Toby Howard

School of Computer Science:BSc. in Computer Science

May 5, 2010

Abstract

The project concerns the creation of an application striving to make three di-mensional building modelling quicker and more user friendly. Currently mod-elling software is well known to have a rather steep learning curve segregatingthe professional trained to use the software from his client. Making CAD pro-grams more usable allows for many applications; from untrained police officersin a hostage situation being able to annotate and plan in a three dimensionalenvironment to clients of professional CAD users being able to provide directfeedback on designs in three dimensional form.

The premise of the project is that the user will input a two dimensionalplan onto a canvas and the application will then extrude that plan into threedimensions. Tools will be available to add objects such as doors, windows andstairs as well as the ability to extrude buildings over multiple floors. In orderto determine whether the final system is highly usable a heuristic evaluationwill be performed upon the system as well as a full evaluation of how closelythe system adheres to Nielsen’s five golden rules of usability engineering (Seesection 2.2.2 on page 10 for further description).

I

Acknowledgements

I would like to thank my tutor, Toby Howard, for his guidance and incessantwant to test my data structures to their limits. I would also like to thank myfriends in Computer Science who almost always succeeded in simultaneouslyand accidentally solving any logical problems in my project as well as findingnew ones. I would like to thank my parents without whose support I wouldnever had the time necessary to complete the project. Lastly I would like tothank my girlfriend for consistently urging me on to improve the project in anyway possible.

II

CONTENTS

Abstract I

Acknowledgements II

Contents III

List of Figures VI

List of Code Samples IX

1 Introduction 11.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11.2 Motivation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1

1.2.1 Past Work . . . . . . . . . . . . . . . . . . . . . . . . . . . 11.2.2 Project Motivation . . . . . . . . . . . . . . . . . . . . . . 4

1.3 Objectives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4

2 Background survey 52.1 Other Similar Software Packages . . . . . . . . . . . . . . . . . . 5

2.1.1 Google SketchUp . . . . . . . . . . . . . . . . . . . . . . . 52.1.2 Autodesk AutoCAD . . . . . . . . . . . . . . . . . . . . . 7

2.2 Problems With Current Software . . . . . . . . . . . . . . . . . . 72.2.1 Speed . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82.2.2 Ease of Use . . . . . . . . . . . . . . . . . . . . . . . . . . 102.2.3 Issue of Accuracy . . . . . . . . . . . . . . . . . . . . . . . 11

3 Design 123.1 Requirements Analysis . . . . . . . . . . . . . . . . . . . . . . . . 12

3.1.1 Aims . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 123.1.2 Crucial Features . . . . . . . . . . . . . . . . . . . . . . . 153.1.3 Bonus Features and Wishlist . . . . . . . . . . . . . . . . 15

3.2 Choice of Language . . . . . . . . . . . . . . . . . . . . . . . . . . 163.2.1 Why JOGL? . . . . . . . . . . . . . . . . . . . . . . . . . 183.2.2 Choice of IDE . . . . . . . . . . . . . . . . . . . . . . . . 19

III

3.3 Data Structures . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193.3.1 Appropriate Data Structures . . . . . . . . . . . . . . . . 193.3.2 Representing tools and options settings . . . . . . . . . . 20

3.4 Ease of Use . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 213.4.1 User Interface . . . . . . . . . . . . . . . . . . . . . . . . . 213.4.2 Outsourcing code . . . . . . . . . . . . . . . . . . . . . . . 22

4 Implementation 244.1 The two Dimensional View . . . . . . . . . . . . . . . . . . . . . 24

4.1.1 The Splash Screen . . . . . . . . . . . . . . . . . . . . . . 244.1.2 Setting up OpenGL with Java . . . . . . . . . . . . . . . 244.1.3 The Grid . . . . . . . . . . . . . . . . . . . . . . . . . . . 254.1.4 Interactive Sketching . . . . . . . . . . . . . . . . . . . . . 26

4.2 Tools in two Dimensions . . . . . . . . . . . . . . . . . . . . . . . 264.2.1 The Free Draw Tool . . . . . . . . . . . . . . . . . . . . . 274.2.2 The Shape Toolbox . . . . . . . . . . . . . . . . . . . . . 294.2.3 Importing .obj files . . . . . . . . . . . . . . . . . . . . . . 334.2.4 The Edit Vertices Tool . . . . . . . . . . . . . . . . . . . . 334.2.5 The Annotate Tool . . . . . . . . . . . . . . . . . . . . . . 354.2.6 The Place Camera Tool . . . . . . . . . . . . . . . . . . . 374.2.7 Traversing floors . . . . . . . . . . . . . . . . . . . . . . . 384.2.8 Saving and Loading . . . . . . . . . . . . . . . . . . . . . 384.2.9 Converting to three Dimensions . . . . . . . . . . . . . . . 39

4.3 The Three Dimensional View . . . . . . . . . . . . . . . . . . . . 404.3.1 Basics and Tessellation . . . . . . . . . . . . . . . . . . . . 404.3.2 Freeview Mode . . . . . . . . . . . . . . . . . . . . . . . . 434.3.3 Camera View Mode . . . . . . . . . . . . . . . . . . . . . 454.3.4 Textures . . . . . . . . . . . . . . . . . . . . . . . . . . . . 464.3.5 Problems Encountered . . . . . . . . . . . . . . . . . . . . 47

4.4 Other Topics of Interest . . . . . . . . . . . . . . . . . . . . . . . 494.4.1 The Help System . . . . . . . . . . . . . . . . . . . . . . . 514.4.2 Undo and Redo . . . . . . . . . . . . . . . . . . . . . . . . 51

5 Results 545.1 Main Use Case . . . . . . . . . . . . . . . . . . . . . . . . . . . . 545.2 Examples of Specific Use Cases . . . . . . . . . . . . . . . . . . . 67

6 Testing and Evaluation 746.1 Heuristic Evaluation . . . . . . . . . . . . . . . . . . . . . . . . . 746.2 Unrealistic Buildings . . . . . . . . . . . . . . . . . . . . . . . . . 756.3 Speed, Ease of Use and Accuracy . . . . . . . . . . . . . . . . . . 79

6.3.1 Speed . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 796.3.2 Accuracy . . . . . . . . . . . . . . . . . . . . . . . . . . . 806.3.3 Ease of Use . . . . . . . . . . . . . . . . . . . . . . . . . . 81

7 Conclusion 837.1 Success Analysis . . . . . . . . . . . . . . . . . . . . . . . . . . . 83

7.1.1 Comparison of Objectives to Results . . . . . . . . . . . . 837.1.2 Additional Features Included . . . . . . . . . . . . . . . . 83

7.2 Further Work . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 84

IV

7.2.1 Possible Additions in Future . . . . . . . . . . . . . . . . 847.3 Final Words . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 85

Bibliography 86

A Project Plan AA.1 Aims and Objectives . . . . . . . . . . . . . . . . . . . . . . . . . AA.2 Proposed system features . . . . . . . . . . . . . . . . . . . . . . A

A.2.1 Essential Features . . . . . . . . . . . . . . . . . . . . . . AA.2.2 Possible Extra Features . . . . . . . . . . . . . . . . . . . B

A.3 Task, milestone and deliverable summary . . . . . . . . . . . . . B

B Glossary D

C AutoCAD and SketchUP interview FC.1 AutoCAD . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . FC.2 SketchUp . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . G

D Code Samples H

E UML Diagrams K

F Sample .ss save file M

G Sample .obj file P

H Textures used RH.1 Wall and Stair Textures . . . . . . . . . . . . . . . . . . . . . . . RH.2 Doors and Windows . . . . . . . . . . . . . . . . . . . . . . . . . TH.3 Skybox textures . . . . . . . . . . . . . . . . . . . . . . . . . . . . U

I List of Heuristic Evaluation Categories V

J Heuristic Evaluation W

K Questionnaire

V

LIST OF FIGURES

1.1 Speedy Sketch third year project 2006 . . . . . . . . . . . . . . . 21.2 Speedy Sketch third year project 2007 . . . . . . . . . . . . . . . 31.3 Autodesk: Project Dragonfly . . . . . . . . . . . . . . . . . . . . 3

2.1 Model house in SketchUp . . . . . . . . . . . . . . . . . . . . . . 62.2 Rendering with Kerkythea . . . . . . . . . . . . . . . . . . . . . . 62.3 The AutoCAD Interface . . . . . . . . . . . . . . . . . . . . . . . 8

3.1 Nielsen’s learning curves . . . . . . . . . . . . . . . . . . . . . . . 133.2 Speedy Sketch in C# . . . . . . . . . . . . . . . . . . . . . . . . . 173.3 Scene graph for a park . . . . . . . . . . . . . . . . . . . . . . . . 183.4 OpenGL Pipeline . . . . . . . . . . . . . . . . . . . . . . . . . . . 193.5 Interface Design Plan . . . . . . . . . . . . . . . . . . . . . . . . 22

4.1 Screenshot of splash screen . . . . . . . . . . . . . . . . . . . . . 254.2 Drag and release flow chart . . . . . . . . . . . . . . . . . . . . . 274.3 Freedraw and shape toolbox . . . . . . . . . . . . . . . . . . . . . 284.4 The shape toolbox . . . . . . . . . . . . . . . . . . . . . . . . . . 284.5 Example of snapping algorithm . . . . . . . . . . . . . . . . . . . 294.6 Screenshot of rectangles and ellipses . . . . . . . . . . . . . . . . 304.7 Screenshot depicting doors and windows . . . . . . . . . . . . . . 314.8 Screenshot of stairs in two dimensions . . . . . . . . . . . . . . . 324.9 Screenshot depicting some imported .obj files . . . . . . . . . . . 344.10 Screenshot depicting the editing of vertices . . . . . . . . . . . . 354.11 Screenshot demonstrating an irregular diagonal line . . . . . . . . 364.12 Screenshots of annotation . . . . . . . . . . . . . . . . . . . . . . 374.13 Save and load flow chart . . . . . . . . . . . . . . . . . . . . . . . 394.14 Screenshots of conversion . . . . . . . . . . . . . . . . . . . . . . 404.15 Screenshot of 3d options . . . . . . . . . . . . . . . . . . . . . . . 414.16 Three dimensional coordinates . . . . . . . . . . . . . . . . . . . 424.17 Examples of convex and concave shapes . . . . . . . . . . . . . . 424.18 Examples of tessellated shapes . . . . . . . . . . . . . . . . . . . 434.19 Viewing from camera . . . . . . . . . . . . . . . . . . . . . . . . . 45

VI

4.20 Skybox movement . . . . . . . . . . . . . . . . . . . . . . . . . . 474.21 Screenshot of z-fighting . . . . . . . . . . . . . . . . . . . . . . . 484.22 Causes of z-fighting . . . . . . . . . . . . . . . . . . . . . . . . . . 484.23 Translating to the ground plane . . . . . . . . . . . . . . . . . . . 504.24 Printing from two dimensional view . . . . . . . . . . . . . . . . 504.25 Screenshots of help . . . . . . . . . . . . . . . . . . . . . . . . . . 514.26 Screenshot of webhelp . . . . . . . . . . . . . . . . . . . . . . . . 524.27 The undo/redo stack . . . . . . . . . . . . . . . . . . . . . . . . . 53

5.1 Use Case Legend . . . . . . . . . . . . . . . . . . . . . . . . . . . 555.2 User starts up Speedy Sketch . . . . . . . . . . . . . . . . . . . . 555.3 Using the freehand tool . . . . . . . . . . . . . . . . . . . . . . . 565.4 Selecting the rectangle tool . . . . . . . . . . . . . . . . . . . . . 565.5 Using the rectangle tool . . . . . . . . . . . . . . . . . . . . . . . 575.6 Selecting the ellipse tool . . . . . . . . . . . . . . . . . . . . . . . 575.7 Using the ellipse tool . . . . . . . . . . . . . . . . . . . . . . . . . 585.8 Moving to three dimensions . . . . . . . . . . . . . . . . . . . . . 585.9 Three dimensional view 1 . . . . . . . . . . . . . . . . . . . . . . 595.10 Selecting the staircase tool . . . . . . . . . . . . . . . . . . . . . . 595.11 Using the stair tool . . . . . . . . . . . . . . . . . . . . . . . . . . 605.12 Selecting the doorway tool . . . . . . . . . . . . . . . . . . . . . . 605.13 Using the door tool . . . . . . . . . . . . . . . . . . . . . . . . . . 615.14 Selecting the window tool . . . . . . . . . . . . . . . . . . . . . . 615.15 Using the window tool . . . . . . . . . . . . . . . . . . . . . . . . 625.16 Selecting the annotation tool . . . . . . . . . . . . . . . . . . . . 625.17 Using the annotation tool . . . . . . . . . . . . . . . . . . . . . . 635.18 Placing the camera . . . . . . . . . . . . . . . . . . . . . . . . . . 645.19 Moving to three dimensions . . . . . . . . . . . . . . . . . . . . . 655.20 Three dimensional view 2 . . . . . . . . . . . . . . . . . . . . . . 665.21 Three dimensional view 3 . . . . . . . . . . . . . . . . . . . . . . 665.22 Using the multi floor tool . . . . . . . . . . . . . . . . . . . . . . 675.23 Using the multi window tool . . . . . . . . . . . . . . . . . . . . . 685.24 Three dimensional view 4 . . . . . . . . . . . . . . . . . . . . . . 685.25 Selecting the import object tool . . . . . . . . . . . . . . . . . . . 695.26 Modifying imported object . . . . . . . . . . . . . . . . . . . . . 705.27 Printing in two dimensions . . . . . . . . . . . . . . . . . . . . . 715.28 Three dimensional view 5 . . . . . . . . . . . . . . . . . . . . . . 725.29 Loaded scene . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 725.30 Three dimensional view 6 . . . . . . . . . . . . . . . . . . . . . . 73

6.1 Heuristic evaluation curve . . . . . . . . . . . . . . . . . . . . . . 756.2 Self-intersecting shape . . . . . . . . . . . . . . . . . . . . . . . . 766.3 Self-intersecting shape in three dimensions . . . . . . . . . . . . . 776.4 Creating a floating building . . . . . . . . . . . . . . . . . . . . . 776.5 Creating a floating building 2 . . . . . . . . . . . . . . . . . . . . 786.6 Floating structure in three dimensions . . . . . . . . . . . . . . . 786.7 Number of polygons vs framerate . . . . . . . . . . . . . . . . . . 806.8 Number of polygons vs framerate 2 . . . . . . . . . . . . . . . . . 80

7.1 Improved circle method . . . . . . . . . . . . . . . . . . . . . . . 84

VII

E.1 Design Class Diagram for 2D . . . . . . . . . . . . . . . . . . . . KE.2 Design Class Diagram for 3D . . . . . . . . . . . . . . . . . . . . L

H.1 Brick and light brick . . . . . . . . . . . . . . . . . . . . . . . . . RH.2 Dirty brick and eroded brick . . . . . . . . . . . . . . . . . . . . . SH.3 Grey wall and stairs . . . . . . . . . . . . . . . . . . . . . . . . . SH.4 Window and door . . . . . . . . . . . . . . . . . . . . . . . . . . . TH.5 Skybox faces . . . . . . . . . . . . . . . . . . . . . . . . . . . . . U

VIII

LIST OF CODE SAMPLES

1 Code to snap in the x direction . . . . . . . . . . . . . . . . . . . 262 Sampling algorithm extract code . . . . . . . . . . . . . . . . . . 293 Calculating the latitude and longitude . . . . . . . . . . . . . . . 444 Modified Collinearity Algorithm . . . . . . . . . . . . . . . . . . 495 Sample JOGL code . . . . . . . . . . . . . . . . . . . . . . . . . . H6 Sample code for the drawGrid() function . . . . . . . . . . . . . . I7 Code demonstrating stair orientation . . . . . . . . . . . . . . . . I8 Code sample demonstrating bounding squares . . . . . . . . . . . J

IX

CHAPTER 1

INTRODUCTION

1.1 Introduction

The project brief described an interest in a system that could be used “in sit-uations such as hostage-taking, surveillance, kidnapping, raid planning, con-tingency planning”[1]. Speedy Sketch certainly began development with this inmind but quickly developed into a much more general application that had manymore possibilities (although many of the tools and expansions were inspired bythe idea of the police use).

It is particularly important to note that Speedy Sketch was developed usingthe Unified Process and adheres to as many appropriate design patterns as pos-sible [2]. This is worth mentioning as certain features that were developed werenot initially planned and came about after several iterations of the developmentcycle were complete. New features were deemed appropriate to include and aconclusion was reached that the inclusion of a certain feature would aid theusability or add to the functionality of the application.

1.2 Motivation

The primary source of motivation for this project lies in a need for a threedimensional modelling application that is quick and easy to use. Many CADsoftware packages already exist but as discussed later (See Chapter 2 on page 5)they are generally difficult to master and are somewhat inaccessible to modellingnovices.

1.2.1 Past Work

Several attempts have been made, both in the form of past third year projectsas well as professional applications, to implement a tool capable of constructingthree dimensional models of buildings from two dimensional input with relativeease and speed. Mentioned here are some positive and negative aspects of the

1

2006 [3] and 2007 [4] Speedy Sketch third year projects at the University ofManchester as well as the Autodesk online application “Project Dragonfly” [5].

Figure 1.1 shows an example of three dimensional output in multiple viewmode in the 2006 Speedy Sketch third year project [3]. This is the earliest im-plementation of Speedy Sketch found on record at the University of Manchesterproject library [6]. As such it is rather simplistic and performs a bare minimumwhen it comes to the three dimensional aesthetic presentation of the model. Aswell as re-inventing this implementation from the very beginning, the currentimplementation draws from several of the ideas of this project; most notablythe splash screen and the printing feature.

Figure 1.1: Example of a Speedy Sketch third year project from 2006 by Mark Mc-Dowell [3]

Figure 1.2 demonstrates a multiple view output of the 2007 implementationof the Speedy Sketch project [4]. It is immediately obvious that this applicationhas attempted to expand the previous implementation through features such astexture mapping and lighting. The application is still somewhat aestheticallyunappealing and it is my belief that the user is given too much freedom withtoo few specific tools to accomplish the modelling process. The current imple-mentation of Speedy Sketch learns from this and attempts to apply the highcohesion design pattern [2] at a high layer of abstraction rather than pack mostof the functionality into one tool (e.g. a freehand draw tool).

Figure 1.3 shows the two dimensional and three dimensional views of Au-todesks’ Project Dragonfly [5]. This application is online in its entirety andis implemented using flash. As such, it is rather sluggish at rendering a threedimensional scene and is limited to six orbital viewpoints. The application isrelatively easy to use but is simply still too limited in the functionality involved

2

Figure 1.2: Example of a Speedy Sketch third year project from 2007 by Chris Green[4]

in exploring the three dimensional environment to be of value for police use.A particularly interesting feature included in Project Dragonfly is the inclu-

sion of an object repository. A user is able to select objects such as beds, tablesand staircases and import them into their scene. Another feature in ProjectDragonfly that appeared to be missing from the other Speedy Sketch projectswas the ability to edit the scene after it was completed. The current implemen-tation of Speedy Sketch remedies this by including an edit feature as well as theability to import objects.

Figure 1.3: Example model of a house in Autodesk’s Project Dragonfly [5]

3

With this first glance analysis of existing work complete it is possible toestablish some key factors that should be deemed as highly important for thecurrent implementation of Speedy Sketch and thus determine reasons why morework in the field is necessary.

1.2.2 Project Motivation

As demonstrated by the lack of concise, usable features in past Speedy Sketchprojects along with the lack of interactivity with the three dimensional modelwith the professional Dragonfly application there appears to be much scope forimprovement and expansion within the category of usable modelling software.Speedy Sketch aims to draw from these past works as well as the more commonlyused professional packages described in Chapter 2 on page 5 and attempt toimplement as many of the positive aspects of the application set whilst avoidingor preferably improving the negative ones.

1.3 Objectives

Speedy Sketch has one primary objective:

• To successfully convert two dimensional input into a three dimensionalrepresentation of a building.

However, it must achieve this objective under some contraints:

• The system must be highly usable and thus score as highly as possible intesting based on Nielsen’s five HCI concepts [7].

• The system must be able to generate the output quickly and run the threedimensional scene in real time (> 25 frames per second) [9].

The first constraint is further described and analysed in Section 6.3.3 onpage 81 whereas the second comes about naturally when considering what theprogram is to be used for. For the program to be described as quick and for athree dimensional scene to be fully interactive the viewable portion of the scenemust be rendered as quickly or faster than the user is able to interact with it.For the scene to be fully animated and any movement to appear smooth tothe human eye (without added motion blurring) the scene must be re-drawnapproximately 25 times each second (or output at 25 frames per second) [9].Appropriate testing for this constraint is included in Section 6.3 on page 79.

4

CHAPTER 2

BACKGROUND SURVEY

2.1 Other Similar Software Packages

Many 2D to 3D modelling packages already exist. The majority of the softwareaimed at designing buildings are in the form of CAD (Computer Aided Design)packages. Speedy Sketch is mostly concerned with ease of use and the speedwith which one can build a three dimensional model of a building.

Analysis of two commonly used software packages follows. The most notableof which is Google SketchUp [10] which is one of the easiest to learn. The otherinclusion is of AutoCAD [11], probably the most commonly used 3D modellingtool for buildings on the professional market. Some noteworthy software notincluded in this analysis include 3ds Max [12], Blender [13], AC3D [14] andMaya [15]. It is also worth taking note that 3ds Max, Maya and AutoCAD areall produced by the same company (Autodesk).

2.1.1 Google SketchUp

SketchUp is a 3D modelling package originally designed by @Last Software andfirst released in 2000 [16]. @Last Software was bought by Google in 2006 [17] andfurther developed with the understanding that currently existing CAD softwarehad too steep a learning curve and thus SketchUp should be as easy to use aspossible.

Figure 2.1 shows an example of a house built with Google SketchUp 7 [18].It is clearly a very detailed and well rendered model but somehow lacking inrealism (the model looks very much like a sketch). SketchUp has the ability toexport these models into other renderers to create a more realistic final output.

One example of such a renderer is Kerkythea [19]. Figure 2.2 demonstrateswhat such a renderer can accomplish. It is worth noting that enabling suchaccurate rendering with techniques incorporating global illumination (realisticlighting and reflections) as well as accurate representations of various surfacesdrastically increase the time taken to render a scene and are likely to take itout of the realm of real time.

5

Figure 2.1: A model of a house made with SketchUp [18]

Figure 2.2: A Google SketchUp model rendered with Kerkythea [19]

6

SketchUp is well known for how easy it is to use relative to other modellingpackages. It is still, however, very difficult for a user who has no prior experiencewith 3D modelling to construct a model of a building that is familiar to them.This is later demonstrated as Speedy Sketch is tested and the ease with which auser is able to construct a familiar building is compared with other applications(See Section 6.3.3 on page 81).

SketchUp works primarily on the idea of the user drawing out basic shapesand extruding them with a tool. This allows a very quick construction of modelsof any size. The 3D extruded shape may then be further divided into simpleshapes and yet again extruded in any direction. Thus a complicated structureof simple shapes can be made into a 3D model.

Whilst relatively intuitive, this technique does take some time to master. Assuch, the software is probably not appropriate for complete novices without anyprior training. Rendering within SketchUp is done in real time as the user isbuilding their model. This is particularly useful as it is immediately obvious ifa model looks correct.

2.1.2 Autodesk AutoCAD

Another very commonly used software package for 3D modelling is Autodesk’sAutoCAD [11]. It was originally released by Autodesk in 1982 as primarily atwo dimensional design tool. Many 3D modelling software tools were addedlater and with the release of AutoCAD 2007 many 3D editing tools were alsoincluded [20].

As shown in Figure 2.3 it is immediately obvious that the interface is muchmore complicated than that of SketchUp. AutoCAD along with Autodesk’svarious other modelling packages are targeted at the top end of their respectivemarket and thus have a very steep learning curve.

AutoCAD works on the premise that the user would first create a two di-mensional, layered plan of the project then work with various other (usuallyAutodesk) tools to extract three dimensional information from it. This is verytime consuming even for experts but results in highly accurate and frequentlyvisually stunning results.

AutoCAD’s primary focus is on accuracy and visually appealing results. Thisfrequently results in the model being passed through a renderer which outputsthe model as a single frame viewed from a single angle. It is possible to achievea real time photo realistic model with rendering techniques such as radiosity[22]. Such techniques, however, require a lot of preprocessing and therefore maytake a very long time to render but as a result do not require re-rendering on aframe by frame basis.

2.2 Problems With Current Software

These pieces of software are excellent in their own respect and as such are atthe top end of their market. They are, however, not without problems, some ofwhich have already been hinted at. The main two problems with these pieces ofsoftware (along with most other software available in the field of 3D modelling)lie in the categories of speed and ease of use. Both are highly relevant to Speedy

7

Figure 2.3: An example of the AutoCAD 2010 interface [21]

Sketch. A third issue of accuracy is also analysed for the purposes of comparisonwith Speedy Sketch.

2.2.1 Speed

There are two primary factors that must be defined when speed is being dis-cussed in reference to 3D modelling:

Speed of Development This refers to the speed with which the user is ableto construct a fully functioning model and prepare it for rendering.

Speed of Rendering This refers to the speed with which the final model isrendered and continues to be rendered as the user interacts with the scene.A common target is to allow real time interaction with the model in threedimensions.

Both are important when judging how quickly a user is able to construct amodel and make use of it for further analysis or to simply see what the modellooks like.

Speed of Development

SketchUp is well known to be excellent in this field. Someone who knows howto use the software well can create complex models of buildings in a matter ofhours and very simple ones in minutes [23]. There is, however, a problem withthis in that users inexperienced in 3D modelling would take far longer to createeven simple models with any accuracy.

Another interesting factor is the way in which SketchUp’s interface relatesto human perception of three dimensional space. SketchUp requires the user

8

to develop in three dimensions from the beginning, but humans are not verywell evolved to truly understand three dimensional space. As such it is verydifficult to build a full model constantly working in 3D. Speedy Sketch overcomesthis problem by only allowing the user to design a building in two dimensions(although this results in some limitations such as a lack of sloped walls androofs).

“Anyone who has tried to build a stone wall knows how difficultit is to look at a pile of available stones and decide which stone willbest fit into a gap in the wall. There are some individuals, suchas experienced stone masons, who have become proficient with thistask, but most people simply have to try different stones until oneis found that fits reasonably well.

In general, people are good at experiencing 3D and experimentingwith spatial relationships between real-world objects, but we possesslittle innate comprehension of 3D space in the abstract. People donot innately understand three dimensional reality, but rather theyexperience it.” (Ken Hickley, Randy Pausch, John C. Goble, andNeal Kassell, A Survey of Design Issues in Spatial Input, p 214 [24])

AutoCAD is even more limited in this respect as it sacrifices speed of de-velopment in favour of accuracy and visual appeal. The steep learning curveit incorporates is suitable only to those users who are well trained in usingthe software and even professionals take several hours to produce even simplemodels (mostly due to the level of accuracy involved) [25].

AutoCAD is primarily concerned with producing highly accurate models forfuture use in the construction of the model as opposed to just visualising themodel in three dimensions. This professionalism and level of detail applied toanything constructed in AutoCAD greatly increases the time taken to developa model.

Speedy Sketch aims to overcome the issues regarding the speed of devel-opment by being as user friendly as possible, allowing a user who has neverbefore attempted 3D modelling to be able to quickly and easily build a threedimensional visualisation of a building. This is achieved by several decisionsmade at the design stage, mostly concerning the user interface (See Chapter 3on page 12).

Speed of Rendering

A program that renders the scene in real time as you model it is perhaps thebest possible performance one can aim for when speed of rendering is concerned.SketchUp does just this; the user actually draws in the 3D plane, developingthe model in three dimensions right from the start.

As demonstrated earlier (Figure 2.1) it is clear that the rendering style is notphoto-realistic but rather optimised for real time object manipulation. This isperfect for when we simply want a visualisation of the model in three dimensionsbut not acceptable when we really need to take into account the way the objectwill look under different lighting conditions for example. As discussed earlier,however (Figure 2.2), it is possible to use an external renderer on a modelcreated in SketchUp to allow for such modelling but with this in place we losethe ability to develop the scene as it is being rendered in real time.

9

As AutoCAD is primarily concerned with accurate modelling and photo-realistic rendering it is really poor in this category. Realistic looking models arevery aesthetically pleasing but of little use when quick representations are allthat is required [25].

2.2.2 Ease of Use

Jakob Nielsen defined five main HCI concepts in his book (Jakob Nielsen, Us-ability Engineering, p26 [7]):

Learnability The system should be easy to learn so that the user can rapidlystart getting some work done with the system.

Efficiency The system should be efficient to use, so that once the user haslearned the system, a high level of productivity is possible.

Memorability The system should be easy to remember, so that the casualuser is able to return to the system after some period of not having usedit, without having to learn everything all over again.

Errors The system should have a low error rate, so that users make few errorsduring the use of the system, and so that if they do make errors they caneasily recover from them. Further, catastrophic errors must not occur.

Satisfaction The system should be pleasant to use, so that users are subjec-tively satisfied when using it; they like it.

In order for a system to be successful in the category of usability it should scorehighly in all five of these concepts. Thus analysis in each category must beperformed on currently existing software to determine whether it is a highlyusable application.

SketchUp is, in comparison to other 3D modelling applications, easy to learnand once learned it is a highly efficient tool and commonly used by professionalarchitects and designers alike to produce models quickly. The fact that it isonly comparatively easy to learn is important. Speedy Sketch aims to scoreeven more highly in the category of learnability.

SketchUp uses a fairly typical WIMP (Windows, Icons, Menus and Pointers)interface and as such scores very highly in the memorability category. Mostcomputer users are familiar with such an interface and thus, once they learnwhat each tool does, are capable of repeating any modelling techniques theyhave done before. Although errors in past versions were common especiallywhen shapes or lines intersected. These are becoming less common with newerversions of SketchUp. In all SketchUp’s handling and elimination of errors issomewhat impressive.

The category of satisfaction is rather subjective when applied to a single ap-plication but SketchUp has a throng of satisfied users to support it. In conclu-sion SketchUp is a very usable application with the only obvious improvementscurrently being possible in the category of learnability.

AutoCAD scores much lower in many of these categories than SketchUp. Aspreviously discussed, it is quite difficult to achieve a level of proficiency thatallows the creation of useful and detailed models. Although once this level of

10

proficiency is achieved it is actually a very efficient application for creating themodels.

Again, like SketchUp, once learned AutoCAD’s WIMP interface is difficultto forget and common techniques are easily accomplished even after years of notusing the software. Errors within AutoCAD are primarily restricted to the userattempting to perform illogical actions but are much greater in number than inSketchUp.

Satisfaction with AutoCAD is definitely not unanimous but it is well knownto be the most commonly used application when it comes to professional mod-elling of buildings. Thus it does, in fact, score very highly in the satisfactioncategory. In conclusion SketchUp is almost certainly much more user friendly(usable) than AutoCAD but AutoCAD is much more commonly used, this isprimarily due to the issue of accuracy.

2.2.3 Issue of Accuracy

As SketchUp is not necessarily aimed at professional architects and engineersit has less need for absolute accuracy than AutoCAD which is targeted atprofessional architects and engineers. Thus an equilibrium must be decided uponbetween the need for accuracy and the requirement for speed and productivity:AutoCAD catering for the former and SketchUp, the latter.

Accuracy is always more of an issue when the model is eventually goingto become a real structure as opposed than when simply a visualisation or anapproximation will suffice. Speedy Sketch attempts to address the issues ofusability and speed to an extreme without sacrificing too much accuracy.

11

CHAPTER 3

DESIGN

3.1 Requirements Analysis

In order to successfully analyse the application and fulfil the project brief somerequirements must be established then refined. Once these requirements areestablished they can be examined and thus analysed in terms of their valueregarding the final program.

3.1.1 Aims

Some basic objectives have already been established in Section 1.3 on page 4.It is now important for those objectives to be re-iterated and refined into a setof features and behavioural constructs that Speedy Sketch aims to fulfil.

The first objective discusses adhering to Nielsen’s five HCI concepts of us-ability engineering [7]. Thus the five concepts are tackled separately from oneanother and appropriate solutions are proposed.

Learnability

This concept concerns the ease with which the user is able to learn the system.Figure 3.1 (Jakob Nielsen, Usability Engineering, p28) clearly shows that atrade-off must be made and an appropriate equilibrium reached between theease with which a user can learn the system and the final efficiency with whichthe system functions. Speedy Sketch attempts to model the lower novice usercurve.

It is clear that a three dimensional modelling system cannot be completelyintuitive. In fact it is suggested that intuitive is a generally ambiguous word andis one that is inappropriately used in relation to software. Jef Raskin suggestsa more appropriate word when used in the context of HCI is familiar [26].Thus Speedy Sketch aims to provide as familiar an interface as possible. Themanner in which familiarity is to be achieved is discussed further in section 3.4on page 21.

12

Figure 3.1: Learning curves for a hypothetical system that focuses on the novice user,being easy to learn but less efficient to use, as well as one that is hardto learn but highly efficient for expert users (Jakob Nielsen, UsabilityEngineering, p28)[7].

Memorability

The concept of memorability is particularly relevant for casual users who mayhave already learnt the system but have been away from it for some time. Suchusers should not have to re-learn the system from scratch and instead shouldbe able to carry on from where they left off.

An important factor regarding memorability is outlined in Nielsen’s UsabilityEngineering :

“Many modern user interfaces are built on the principle of makingas much as possible visible to the users. Users of such systems donot need to be actively able to remember what is available, since thesystem will remind them when necessary.” (Jakob Nielsen, UsabilityEngineering, p32) [7].

Thus two options are available to score highly in the memorability category:

• Develop an interface that is easily recalled when the user is questionedabout it including a memorable layout, icon set [8] and menu options.

• Develop an interface that accurately guides the user, allowing the repeti-tion of tasks already done in the past, regardless of how long ago.

Speedy Sketch attempts to encompass both of these strategies, incorporatinga highly memorable WIMP interface whilst constantly keeping the user informedof the current state of the program and guiding them through available options.

Efficiency

The efficiency of a system “refers to the expert user’s steady-state level of per-formance at the time when the learning curve flattens out” (Jakob Nielsen,Usability Engineering, p30), see figure 3.1.

13

As demonstrated efficiency and learnability are closely related. It seems,at first that they are mutually exclusive but this is not necessarily the case.A “Best-of-both” scenario can be achieved by “providing a user interface withmultiple interaction styles” (Jakob Nielsen, Usability Engineering, p41). This iscommonly achieved by providing “accelerators” that allow increased efficiencywhen performing repetitive tasks. Such a feature would not be immediately ob-vious to a novice user but would certainly be used for greatly increased efficiencyby an expert user.

Speedy Sketch implements such accelerators in the form of the repeat flooroption and the ability to draw multi-floor shapes. Such features avoid repetitivetasks such as drawing the same shape on multiple floors in order to create askyscraper for instance and instead an experienced user would simply hold 9whilst drawing the shape to extrude it over nine floors.

Errors

In this context errors are defined as “any action that does not accomplish thedesired goal” (Jakob Nielsen, Usability Engineering, p32). Errors should beminimal to non-existent in quantity, the system should, if possible, prevent theuser from making errors in the first place. If this is impossible then any errorthe user makes should be obvious, well documented and reversible. Finally thesystem should have no catastrophic errors; those that destroy the users work orare not immediately obvious and can therefore lead to a faulty or incorrect finalresult.

Speedy Sketch includes an undo/redo feature that makes any action re-versible and attempts to minimise the number of possible errors the users canmake using multiple validation algorithms for possible input. Errors that areunavoidable are immediately displayed and the user is thus informed of theirpresence and is then in a position to act accordingly and remedy the situation.

Satisfaction

Subjective satisfaction is an important category as if Speedy Sketch was to beused at home by potential customers as well as the police in certain situations itis important that the experience is a pleasant one. This is particularly importantfor the former example as if the home user finds the experience of using theapplication a frustrating one then the proposed mock design is less likely to becompleted, making the work of the architect all the more difficult as a result.

Satisfaction is generally achieved in this context by paying attention to theusers needs and prioritising the removal of frustrating bugs whilst simultane-ously speeding up repetitive tasks (as with efficiency). Thus it is common for anapplication that scores highly in learnability and efficiency to also score highlyin the satisfaction category.

Satisfaction is perhaps the category that is the most difficult to test withoutbias. Nevertheless, this shall later be attempted in chapter 6 on page 74 bymeans of a questionnaire. It is common for participants to be agreeable in sucha questionnaire thus multiple questions have their polarity reversed such that apositive answer would in fact result in submitting negative feedback.

14

3.1.2 Crucial Features

The features discussed up to this point are related more to the user interface ofthe system rather than the actual functionality. It is now important, however,to mention some of the features that Speedy Sketch simply must implement.

The following features will from this point onwards be referred to as thefundamental features of the application:

• The application accepts input from a mouse or graphics tablet in the formof a freehand drawing or a set of two dimensional shapes.

• The application can, at the user’s command, extrude the two dimensionalshapes in the third dimension according to the user’s input.

• After extrusion, the user is able to traverse the scene and view it from anyangle using simple controls.

After these fundamental features are in place, there is great room for expan-sion and improvement in the categories of functionality, usability speed.

3.1.3 Bonus Features and Wishlist

Perhaps the most interesting factor of this project is the scope for expansionafter the initial requirements are met. Extra features within the implementationusually came about after implementing another feature and applying similarlogic (sometimes even reusing the code) from that feature. An example of thiswould be the import .obj model tool. The two dimensional interaction works ina similar way to that of the door or window tool and the file is read in muchthe same way as the open file function.

The bonus features and their implementation are discussed in further detailin Chapter 4 on page 24 and only an outline of the most potent features ispresented here:

Multiple floors The fundamental features of Speedy Sketch require a user tobe able to implement a single floor but multiple floor functionality is nevermentioned. As most modern buildings span over several floors this featureis invaluable when modelling buildings. As such in the two dimensionalview of the program the user should be able to traverse floors in somemanner as well as providing input for the current floor.

Windows and Doors As buildings generally have entry and exit locations itis particularly useful to mark those locations as doors and windows inthe three dimensional model. It would also be useful if windows couldbe somewhat transparent to allow for analysis of views from outside thebuilding looking inside. A possible addition to this feature could be afterthe inclusion of collision detection users could then interact with doors(and perhaps windows) to gain entry to the building.

Staircases A method of traversing multiple floors should generally be includedin the application if multiple floors exist. The most common method oftraversing floors in three dimensions is a staircase. An algorithm to auto-matically generate staircases of any length is included in Speedy Sketch.

15

Edit Vertices It is common for users to make mistakes when drawing on thetwo dimensional plane. As such, a small mistake on their part should notresult in the user having to re-draw the entire shape. Speedy Sketch iscapable of editing individual vertex locations after a shape is input.

Save and Load It is particularly useful to construct a model at one time andhave it available to demonstrate to somebody else, perhaps, at anothertime. Thus saving and loading the model is a highly useful feature toinclude in almost any application. It is implemented in Speedy Sketch.

Undo and Redo This concerns the HCI concept of errors. The user may,at some point, make a catastrophic input error. Such an error shouldnot be catastrophic in nature in the application. If any user action isreversible then the error cannot possibly be catastrophic within SpeedySketch. Thus, an undo/redo feature is included in the application.

3.2 Choice of Language

Past efforts at an application of this nature have been attempted in C++ withOpenGL (the 2006 implementation)[3] and Java with Java3D (the 2007 imple-mentation) [4]. Other equivalent, commercial software is written in a variety oflanguages from C (AutoCAD) [11] to Flash and Actionscript (Autodesk Drag-onfly) [5].

Due to the scale and nature of the project an object oriented language asopposed to a procedural one would be far more appropriate. Also, of course, alanguage that the author has had experience in would be preferable to learninga new language as it would greatly aid the speed and accuracy with which theapplication could then be developed. It was, however, more important to choosea language that was suited to the project as opposed to just accept the one theauthor has had the most experience with and was therefore the most comfortableusing. Although several three dimensional graphics library implementationsexist such as OpenGL [27] and DirectX [28], OpenGL was already chosen fromthe beginning as this is the only graphics library implementation with which theauthor has any experience and learning a new library such as DirectX appearedto be a somewhat insurmountable task for the purpose of this project. As suchseveral options were available:

Java An object oriented language with many options for including three dimen-sional graphics (from Java3D [29] to JOGL [30] to other more complicatedgaming engines [31]). This is almost certainly the language with whichthe author is most familiar.

C# Another, more modern object oriented language, again with several threedimensional library implementations (from CsGL [32] to tao [33]). Thestructure of the language is somewhat similar to that of Java and it istherefore immediately apparent that it is a candidate for the language ofchoice.

C++ The main advantage of C++ over the other choices of language is thatthe OpenGL libraries for the language are native as opposed to wrappersfor the language. The author’s experience with OpenGL has primarily

16

been in C which would easily be adaptable to the class based structure ofC++. A few problems that immediately arise with the use of C++ arememory management issues as well as the author’s inexperience with thelanguage when not being used in a graphical context.

With the three contenders for the language of choice established, furtheranalysis was required to refine them down to two options (and then again tothe chosen language). After much contemplation C++ was rejected first dueto memory not really being a major issue on modern computers coupled withthe author’s inexperience in the language. The remaining languages were notso easily rejected and it was decided that a throwaway prototype (or at leastthe beginnings of one) should be made in order to decide concretely.

In order for a language to be selected the application was developed in bothlanguages in parallel over a period of one month. The resulting language thatwould be selected would then be the one that seemed the most appropriatebased on experience using it in developing Speedy Sketch. Figure 3.2 showsthe stage reached after a month in C# with the tao framework [33] used as anOpenGL library. As shown, interaction with the canvas was minimal and onlya continuous input could be taken from the user. The buttons on the GUI werealso not quite what was desired as if the user were to use a graphics tablet forinput the small buttons along the bottom of the window would be very difficultto select.

Figure 3.2: Throwaway prototype of Speedy Sketch written in C# with the taoframework for OpenGL

By this point the Java equivalent of Speedy Sketch was able to convert theuser’s input to a basic representation of a three dimensional model. Also, theGUI was much more pleasant to use in the Java version; the buttons were large

17

and easily accessible and multiple lines of input were accepted from the user asinput. Thus Java was chosen to be the language with which Speedy Sketch wasto be implemented.

3.2.1 Why JOGL?

As discussed in Section 3.2 there are several graphics libraries available for usewith the Java programming language. A previous attempt at the Speedy Sketchproject used Java with Java3D [4]. Java3D is a scene graph based API whichmeans a virtual world is constructed in a very structured manner, navigatinga tree structure in order to correctly render elements. Figure 3.3 demonstrateshow a scene graph of how a park environment might look.

Figure 3.3: Scene graph for an imaginary park

Although this approach is highly coherent with the object oriented nature ofthe project it does not really offer complete control over the lower level OpenGLpipeline. OpenGL is, in essence, a procedural state machine and thereforeapplying object oriented concepts to it appears somewhat redundant. Havingcomplete control over the OpenGL pipeline also allows for a more optimisedand efficient implementation of Speedy Sketch.

As such, JOGL (OpenGL for Java), is used to implement Speedy Sketch.JOGL is a set of wrappers for the fundamental C implementation of OpenGL.The functions work much like those in C but are instead called from a staticGL class. Code sample 5 in Appendix D on Appendix page H demonstrates thecore of a JOGL program that would draw a straight line of length 1 along thex axis.

OpenGL, as mentioned, is a state machine. Loosely this means that whena property is set in OpenGL that property remains until it is unset. The mainuse for OpenGL is essentially transposing an object in a three dimensionalworld onto a two dimensional plane (e.g. a screen). There are many books andjournals on how this works so only an outline is given here as opposed to a fullaccount. Figure 3.4 demonstrates the necessary steps and transformations thata set of three dimensional coordinates must go through in order to correctlybe transposed onto the user’s screen. These steps are concerned primarily with

18

matrix transforms based on properties set within OpenGL and are not actuallyvisible to the developer. JOGL uses these same concepts through a wrapper forthe native C libraries and has various wrappers for the language to allow foroperating system independence, keeping the application platform neutral andadhering to Sun Microsystem’s famous Java slogan: “Write once, run anywhere”[34]

Figure 3.4: Outline of the OpenGL pipeline

3.2.2 Choice of IDE

Speedy Sketch was written in its entirety in Netbeans 6.7.1, an open sourceIDE aimed primarily at Java application development [35]. Eclipse [36] was alsoconsidered as a potential IDE for Speedy Sketch but failed to provide adequateintegration for GUI development and JOGL integration without additional plug-in installation.

Netbeans included a GUI builder to immediately simplify the creation ofGUIs and even integrated a JOGL canvas and panel into its tool kit after in-stalling a few plug-ins again simplifying any higher level development that mayhave been required.

3.3 Data Structures

The choice of language (Java) provided suitable data structures in the form ofcollections; more specifically the ArrayList class for most of the data.

3.3.1 Appropriate Data Structures

Whilst inputting a two dimensional drawing into the application, the user shouldbe able to include as many points, lines and shapes as desired without causingany errors within the application. If the vertices the user inputs were storedsimply in an array this would soon fill up and functions would have had to bewritten to test for this and expand the array capacity.

19

Inevitably, some sorting would eventually have to occur on the data structureholding these vertices. As such, if they were stored in an array, some form ofoptimised sort would have had to be researched and implemented in order forSpeedy Sketch to remain quick in performing tasks. Thus instead of using simplearrays to store vertex data, Speedy Sketch uses the ArrayList collection as aprimary data structure. Perhaps the most prominent advantages of this arethe fact that the ArrayList cannot overflow and that the implementation of thesort() function within the collection is guaranteed to run in n log(n) time [37].

3.3.2 Representing tools and options settings

Speedy Sketch has many different tools available for use and several differentoptions that may, at any point be enabled or disabled. Thus, an appropriateway of modelling this behaviour had to be devised. In order to accomplish thefact that the application could be in any one and only one of a set of states atone time these were represented as static final integers. As shown in Figure E.1in Appendix E (A UML representation of the two dimensional parts of SpeedySketch) the GLRenderer class contains an integer labelled cmd (shorthand for“command”). This integer could take one of five values:

UPDATE This is the default value of the command state and simply infinitelyloops over the OpenGL canvas and redraws the scene every time.

DRAWING This state is activated when the user is drawing. It is the sameas the UPDATE state but also constantly updates any input given bythe user thus having the effect that the user is interactively drawing on acanvas.

ANNOT This state is activated when the user is inputting an annotation. Itworks in the same way as the DRAWING state but instead only updatesthe annotations as well as anything already input onto the canvas.

DOORWINDOW This state is activated when the user chooses to input adoor or a window object onto the grid. It has all the functionality of theUPDATE state but also constantly renders and updates a line (whoseorientation is decided by the user) at the user’s cursor location. This linerepresents a potential window or door.

NOTHING This state is only implemented as a security measure when thesystem should be doing nothing at all (this should never happen).

Tools are represented in much the same way (as static final integers) withthe only initial effect of selecting a tool using the GUI being a change in thestate of the tool variable, again demonstrated in Figure E.1 in Appendix E.Implementing tools in this manner allows for great modularity if the applicationwere to be expanded and would make it very easy to integrate new tools simplyby implementing their functionality (none of the existing code would have to bemodified).

Figure E.1 in Appendix E shows the base two dimensional classes of SpeedySketch and their relationships to each other. It is important to notice severalfactors within the diagram: ShapeChooser (A GUI component for choosing ashape) has no relation to the rendering class (GLRenderer) and, as mentioned,

20

only acts in changing the tool selected in the main GUI (SpeedySketch) whichin turn changes the state of the tool variable within the rendering class.

Within the implementation, classes that model the shapes themselves (Shapeand Annotation) have no relation to any GUI components. They are simplycalled by the renderer and return their respective data structures for rendering.A final noteworthy point about the diagram is that the rendering class inheritsfunctionality from several other classes implemented either within the Java API(e.g. MouseListener) or the JOGL API (i.e. GLEventListener). The inheri-tance from the Java API is in place to allow the user to interact with the canvaswhereas the inheritance from the JOGL API is in place to implement the baseOpenGL rendering functions.

3.4 Ease of Use

As discussed earlier it is of utmost importance for the system to adhere as closelyas possible to Nielsen’s five HCI concepts. Also, as discussed the system mustbe familiar to those with some computer experience.

In order to achieve the familiarity requirement Speedy Sketch must rely ona WIMP interface. As a graphics tablet is a possible method of input, anybuttons included in the GUI must be large and easily navigable. As mentionedin Appendix B on appendix page D “familiarity may be achieved by mimickingthe visual appearance of real world objects” [38]. With this in mind, SpeedySketch mimics a real world canvas as an input surface and the toolbox buttonsrepresent a somewhat simplified real world set of tools that may be used tofacilitate input onto the surface.

There is a quote from Steve Krug’s book Don’t make me think! that relatesthe propagation of familiarity through the internet. This concept can very muchbe applied to desktop software as well as web sites:

“All conventions start life as somebody’s bright idea. If the ideaworks well enough, other sites imitate it and eventually enough peo-ple have seen it in enough places that it needs no explanation. Thisadoption process takes time, but it happens pretty quickly on theInternet, like everything else.” (Steve Krug, Don’t make me think!,p34 [39])

Thus applying similar concepts and menu structure to commonly used soft-ware will undoubtedly improve familiarity and also learnability. Speedy Sketchimplements menu structures common to many major commercial software pack-ages by including common actions and tasks under menu headings that existin most commonly used applications; opening and saving tasks under the Filemenu and undo and redo tasks under the Edit menu amongst others.

3.4.1 User Interface

Figure 3.5 represents a wire-frame concept design of the Speedy Sketch twodimensional input interface. There are several noteworthy items on the diagram.The first is the inclusion of labels in the lower left quadrant. These labels keepthe user informed as to what tool is currently selected and the current floor

21

number. Without such labels the user would constantly have to rememberwhich floor they are editing as well as which tool they are currently using.

Another particularly important feature that is worth mentioning at thispoint is the size of the buttons along the left. It would have been possible torestrict all tool changing functionality to the main menu along the top. This,however, would have made the interface cumbersome and sluggish, requiring ex-tra clicks and would have been particularly inefficient if the user was interactingwith Speedy Sketch in the form of a graphics tablet.

Figure 3.5: Proposed design of the 2 dimensional interface

Finally, the main input grid, somewhat resembling graph-paper, allows theuser to interact with the surface in a familiar manner (drawing on paper) albeita user, in real life, may not select a square or circle tool to draw the respectiveshape, these are in place to facilitate already familiar actions.

3.4.2 Outsourcing code

As Speedy Sketch was implemented, more complicated features and functionswere required to satisfy the requirements previously established. Such functionswere commonly found implemented elsewhere and thus it seemed far more ap-propriate to simply reuse the code written by others in such cases. All reusedcode is referenced in the bibliography and at the time of its use in Chapter 4 onpage 24. Some code (e.g. code to launch a browser) was originally outsourced

22

then re-written by the author and is therefore of minimal significance (otherthan, perhaps, inspiration).

23

CHAPTER 4

IMPLEMENTATION

4.1 The two Dimensional View

The two dimensional view is composed of several parts, the implementations ofthe most important and interesting parts are described in greater detail thanthe more trivial ones.

4.1.1 The Splash Screen

The splash screen is generally an image that is visible to the user upon firstloading of the application. The purpose of a splash screen is to lower the appli-cation’s loading time in relation to the user’s perception. With a splash screenin place, the program would still take the same amount of time to load butinstead of the user experiencing no feedback from the application, the user isshown a screen relating to the application with the implication that the pro-gram is loading. This lowers the user’s perceptive loading time and makes theprogram appear to load faster than it actually does. Figure 4.1 demonstratesthe splash screen loaded on a desktop background just before the applicationitself loads, it is generally displayed for around 4 to 5 seconds on Windows 7before Speedy Sketch fully loads.

4.1.2 Setting up OpenGL with Java

OpenGL is not native to Java and therefore libraries that implement it or actas wrappers must be used to get OpenGL code to function correctly. SpeedySketch uses JOGL as a wrapper for the C OpenGL libraries. JOGL had severaladvantages over other OpenGL implementations and wrappers from speed tothe ease with which it could be embedded into the Netbeans IDE. It requiredonly a few plug-ins to be installed within the IDE and came complete with GUIobjects that could simply be placed in the GUI builder included in Netbeans.As soon as this was done, several pieces of code were included to run a simpleOpenGL program and only had to be edited as to the developer’s specificationin order to create the application required.

24

Figure 4.1: Screenshot of splash screen as Speedy Sketch is loading

4.1.3 The Grid

The grid was drawn by implementing a drawGrid() function within the maindisplay function of the GLRenderer class. The code for this function is availablein code sample 6 in Appendix chapter D on Appendix page I. The code simplytakes the entirety of the canvas area on the viewer’s screen and renders lines(with a gap of 40 pixels between pairs) firstly from the top to the bottom of thearea then from the left to the right, creating a square grid on the canvas.

The canvas is in place to allow the user to have reference points to how largethe structure they are building is going to be as well as a structure that theuser to have points to snap their preliminary sketches to. This is useful to formregular structures (such as buildings) that have many straight lines and 90◦

corners. The size of the building is set up in such a way that one grid squareapproximately represents slightly more than the width, length and height of ahuman being, that is to say each grid square approximately represents threemetres in width and length. More work could have gone in to precision withthis tool but it was not deemed a high a priority task as some others due to thesketchy nature of the application.

Drawing Simple Objects

The most commonly used input tool is likely to be the FREEDRAW tool whichallows the user to freely input a sketch onto the OpenGL canvas. This sketchwill then be snapped to the grid and the lines of the sketch will be straightenedand simplified for ease of storage in the data structures. Further discussion ofthe FREEDRAW tool is available in Section 4.2.1 on page 27. Other tools areincluded to draw simple objects such as the RECTANGLE and ELLIPSEtools. These tools are discussed further in Section 4.2.2 on page 29 but it is

25

worth noting that these tools are available to the user when discussing otherfeatures such as the snapping algorithm.

Snapping Algorithm

In order to facilitate inputting two dimensional drawings onto the canvas analgorithm is in place to snap any vertices the user inputs to the corners ofthe aforementioned grid structure of the canvas. The algorithm functions onthe premise of taking a vertex the user has input, and for the x coordinate,checking whether the vertex is closer to the left or right edge of the grid square.After this has been established, the vertex is moved to that edge and the samealgorithm is performed on the y vertex. Code sample 1 demonstrates samplecode that snaps a given vertex in the x direction.

//snap a coordinate in the x direction (gs=gridsize=40 pixels)

private int snapX(int rreqx) {

int reqx=rreqx;

//if vertex is on the right side of the grid square

if(reqx%gs>(gs/2))

reqx=reqx+gs-reqx%gs;

else

reqx=reqx-reqx%gs;

return reqx;

}

Code Sample 1: Sample code used to snap the x vertex to the closest vertical gridsquare edge.

With this algorithm in place, only objects with 90◦ corners are possible(as well as ellipses) due to the sampling problem discussed in Section 4.2.1 onpage 29.

4.1.4 Interactive Sketching

It is of utmost importance that the user’s experience with the system is as closeas possible to that of drawing on a real canvas (as opposed to an OpenGL one).A paintbrush or pencil deposits its mark on the canvas as it is being draggedacross the surface and as such the OpenGL canvas must primarily react to adragging action. Due to this, most of the canvas interaction code stems fromthe mouseDragged() action event. The code functions in the manner shown inFigure 4.2 as the user interacts with the canvas when a drawing tool is selected(a drawing tool being any of the subset of the FREEHAND, RECTANGLE andELLIPSE tools).

4.2 Tools in two Dimensions

All editing in Speedy Sketch is performed in the two dimensional view andas such many tools are provided to make modelling buildings an efficient and

26

Figure 4.2: Flow chart describing the functionality of the code as the user interactswith the canvas whilst a drawing tool is selected

generally fun activity. Figure 4.3 demonstrates the FREEDRAW and ShapeToolbox tools on the menu bar along the left of the Speedy Sketch UI. Thecurrently selected tool in the shape toolbox in the figure is the RECTANGLEtool. Figure 4.4 demonstrates the shape toolbox that pops up when the userclicks the shape toolbox menu item. It is worth noting that an option mustbe selected before any further editing and modelling can occur, if no object isselected from this menu (which remains on top of the application until one is)the system is in a NOTHING state and no interaction can occur with thecanvas.

4.2.1 The Free Draw Tool

As mentioned, the free draw tool is probably the most used, most powerful andhence the most important tool available to the user. The tool has no presetshape that it adds to the canvas but instead simply allows the user to freelydraw on the canvas.

This works by storing any user interaction with the canvas in a temporaryarray and putting the system in a DRAWING state (thus dynamically updat-ing the canvas whilst the user draws). Anything the user draws is automaticallycompleted as a full shape (to allow for correct tessellation of floors and ceilingsin the three dimensional view). This works by always duplicating the first vertexof the shape into the last member of the ArrayList that stores the respectiveshape (and rendering the shape in a line loop).

The algorithm does not simply accept all user input then modify it when theuser is done to snap to the grid and adhere to the snapping algorithm (discussedshortly). The algorithm, instead, dynamically snaps the input to the grid andsimply rejects any input that is surplus to requirement. This optimises the speedwith which the algorithm functions; no post-processing is required once the userreleases the mouse. This also has the advantage that the user can always see

27

Figure 4.3: Free draw tool and shape toolbox menu buttons

Figure 4.4: The shape toolbox with selectable objects including the rectangle, ellipse(highlighted), door, stairs, window and imported .obj file respectively

28

what the shape is going to look like when the mouse is released, there are nounexpected results after the mouse is released.

The Sketch Sampling Algorithm

Figure 4.5 demonstrates the typical input over a grid square (fig 4.5(a)) andwhat that input would look like after snapping all points to the nearest corner(fig 4.5(b)). The result we actually require from such an input is demonstratedin the third grid square (fig 4.5(c)).

(a) Typical Input (b) Incorrect Result (c) Correct Result

Figure 4.5: Typical Input along with incorrect and correct results

We can achieve such a result with reasonable ease if we simply ignore anyinput taken in a central square area within each grid square (shaded area infigure 4.5). The size of the discounted area was optimised through trial anderror to ignore anything within the middle 1

6 of the grid square. Code sample 2demonstrates the snapping algorithm after the added code to remove the centralsquare.

if (mouse_x % 40 < (5*40) / 12 || mouse_x % 40 > (7*40) / 12) {

if (mouse_y % 40 < (5*40) / 12 || mouse_y % 40 > (7*40) / 12) {

snapX(mouse_x);

snapY(mouse_y);

}

}

Code Sample 2: Sampling algorithm extract code

4.2.2 The Shape Toolbox

Rectangle and Ellipse

The shapes currently supported in Speedy Sketch include the Rectangle and theEllipse which, when used with the shift modifier, can be converted into squaresand circles.

The rectangle tool makes much use of the freedraw tool code. Essentially arectangle (or square) is simply a freely drawn shape with only four sides andtherefore only 90◦ corners. Given two points; the point where the mouse is

29

pressed down (x1,y1 ) and the point it is released again (x2,y2 ), a rectangle caneasily be drawn. Once the four vertices of the rectangle are calculated they cansimply be added to the shapes ArrayList in the same way as a freely drawnshape.

The ellipse tool is somewhat more complicated as OpenGL does not appearto have native support for ellipses. As such, ellipses must be calculated fromthe difference between the maximum x and minimum x, the difference betweenthe maximum y and minimum y. In this way the origin of the circle can also becalculated. Once the origin and measurements are calculated the ellipse can berendered by calculating the vertex for each degree around the 360◦ of the circlein the manner depicted in the following equations.

xi = cos(αi) ∗x1 − x0

2+x0 + x1

2(4.1)

yi = sin(αi) ∗y1 − y0

2+y0 + y1

2(4.2)

A shift modifier is also in place to create equilateral equivalents (squares andcircles). This works by making the x difference and y difference equal to eachother (the smaller of the two). Figure 4.6 shows the two shape types along witharrows signifying the mouse actions used to create the shapes. Notice the factthat the mouse gestures used to create the equilateral shapes do not directlyrepresent the shape made but rather relate to the minimum difference in eitherthe x or y direction.

Figure 4.6: Screenshot demonstrating a rectangle (top right), a square drawn withthe shift modifier (bottom left), an ellipse (top right) and a circle drawnwith the shift modifier (bottom right)

These tools are simply in place to make drawing regular shapes more con-venient for the user as opposed to a replacement for the freehand tool. It is,

30

in fact, possible (and usually preferable) to draw most buildings using only thefreehand tool.

Windows and Doors

The user can add windows and doors to any structure with horizontal or ver-tical walls (in the two dimensional plane). The UI representation of a doorand window is a short brown line representing a window or a short blue linerepresenting a door.

Whilst the tool is selected, the line follows the user’s cursor over the canvasand rotates 90◦ if the user right-clicks. Left-clicking, on the other hand, placesthe door or window at the closest grid line (depending on the orientation theuser has selected). Currently, as doors and windows are represented as twoparallel polygons in the three dimensional view, they can only be placed on flatsurfaces with any degree of accuracy. Placing doors and windows on curvedand diagonal surfaces (ellipses, for example) is a possible expansion for SpeedySketch. Figure 4.7 demonstrates the representation of doors and windows inthe two dimensional view. It is currently possible to place doors and windowsat any grid intersection as opposed to on any wall; such a constraint is anotherpossible feature that could be added to Speedy Sketch.

Both the door texture [40] and the window texture [41] are both availableonline.

Figure 4.7: Screenshot depicting a single storey building with doors as short bluelines and windows as short brown lines.

Translucency in windows was attempted at first but correct alpha blending[42] appeared difficult to achieve and it was found that using two parallel poly-gons gave better results. Windows and doors in Speedy Sketch can, in the same

31

way as walls, be extruded over multiple floors by holding a number key downwhilst placing them on the canvas. This allows for much better alignment ofwindows and doors over the height of a building.

Stairs

As Speedy Sketch supports buildings with multiple floors it is useful for a mech-anism to be in place to signify locations in three dimensions where the floorsmay be traversed. The obvious decision was to include staircases.

The most appropriate method for creating staircases in two dimensions wasdeemed to be simply dragging from a bottom corner of a staircase to the topcorner (whilst keeping the staircase width constant). This resulted in a problem;the orientation of the staircase (as well as the location of the bottom and top ofthe stairs) had to be determined based on the user’s mouse input of two points(mouse down and mouse release). Code sample 7 in Appendix D on page Idemonstrates the implementation of this.

The first step is to determine whether the staircase is oriented in the x or ydirection then decide whether the end point is above or below (for x orientation)or to the left or right (for y orientation) relative to the start point. Figure 4.8depicts various staircases inside and outside a building as well as staircases ofdifferent lengths and orientations in the two dimensional view.

Figure 4.8: Screenshot depicting various staircases in the two dimensional view.

It is worth noting that in the three dimensional view stairs are generated toalways have ten steps going from the floor they are placed on to the one above

32

regardless of their length. As such, the longer the staircase, the longer eachindividual step is. The texture applied to the three dimensional staircase canbe found online [43].

4.2.3 Importing .obj files

Importing external Wavefront .obj files was the most recent feature added toSpeedy Sketch (and perhaps one of the most complicated). Wavefront .objfiles are commonly used in three dimensional modelling applications to modelgeometry (as well as some other properties) of objects. The reason this fileformat was chosen as a primary import format for Speedy Sketch is due to theease with which this file-type can be parsed.

Sample .obj file extracts are available in Appendix G on Appendix page P.The file structure consists of a long list of variables defined by a v or vn or vt oran f followed by a series of numbers defining the geometry of the object. Thefollowing are the definitions of each type of line in the file:

v always lists 3 numbers and defines a geometric vertex

vn always lists 3 numbers and defines a vertex normal

f usually lists 3 or 4 number sets (defining triangles or quads) but can list asmany as required. Each number set refers to a vertex and also a normaland texture if required. Each f is known as a face.

vt can list 2 or 3 numbers and defines a texture vertex.

Other line types exist but vt along with others are not parsed in Speedy Sketch.Speedy Sketch reads the .obj file line by line and stores the appropriate

variables to correct ArrayList of vertices or normals. These ArrayLists arethen used to create a LoadedObject object which can then be depicted as a twodimensional cross based on its dimensions (demonstrated in Figure 4.9) andrendered as a scale model in the three dimensional view.

Figure 4.9 also shows the scale chooser slider with which the user is able tochoose the scale of any model being imported. As the slider is moved the crossrepresenting the current model changes size accordingly (its scale is multipliedby the value shown on the slider).

Currently Speedy Sketch only supports .obj files whose faces are trianglesor quadrilaterals (other face types throw an exception which displays an errormessage to the user). Vertex normals as well as shape geometry is completelysupported within Speedy Sketch but other features supported by the .obj file-type such as texture coordinates and curves are not yet implemented and aresimply ignored when parsing the file. A full specification of the Wavefront .objfiletype is available online [44].

4.2.4 The Edit Vertices Tool

It is common for a user to make mistakes when drawing with the freehand tool.These mistakes are usually minor in nature and as a result the resulting drawingclosely resembles the user’s original intention. In order to refine the sketch afterthe initial input is complete a tool to edit individual vertices is included.

33

Figure 4.9: Screenshot depicting 3 imported objects: A chair (inside the building), agazebo (to the right of the building) and a man with arms outstretchedto his side (below the building). A scale chooser is also displayed.

34

Figure 4.10 depicts the manner in which the vertices are displayed to theuser when the edit vertices tool is selected. All the vertices of any shapes thatexist on the current floor are displayed as blue circles. Around each vertex existsa bounding square that constantly checks whether the current mouse locationis within its bounds. If the current mouse location is within the bounds of thevertex then its state is changed to indicate that it is highlighted (and thereforechanges colour to pink). Code sample 8 in Appendix chapter D on page Jdemonstrates the implementation of the bounding squares around each vertexas well as the tagging over highlighted vertices.

Figure 4.10: Screenshot depicting the edit vertices tool with the bottom right vertexhovered over (colour changed to pink).

Once a vertex is highlighted in this manner it may then be clicked on anddragged to a new location. Having been clicked on, the vertex changes colourto yellow (to signify that it is active) and as such is tagged as the active vertex.The user can now drag the vertex to a new desired location and thus change theshape the vertex is part of. Once the user releases the left mouse button, theactive vertex is snapped to the nearest grid corner and again becomes inactive.

This is perhaps one of the most useful and understated tools available inSpeedy Sketch. Using this tool in the correct manner can greatly increase effi-ciency when modelling buildings. The edit vertices tool even allows the user tocreate shapes that would otherwise be impossible to create with regular tools(such as shapes with irregular, long diagonal walls). Such a shape is demon-strated and refined in Figure 4.11.

4.2.5 The Annotate Tool

The project brief [1] describes a possible use for this application being a hostagesituation. In such a situation it is common for team leaders to annotate on

35

Figure 4.11: Screenshot demonstrating a typical result of a diagonal scribble (left)and the refined version after vertex editing (right).

36

maps and draw out plans describing actions that should be taken by other teammembers. As such an annotate tool is implemented in Speedy Sketch to allowthe user to annotate on the ground of the currently selected floor level in acolour specified by the user.

Clicking on the annotate tool presents the user with a colour selection win-dow (implemented by the Java Swing libraries). A colour must then be selected(as the window is modal and therefore no actions may take place in the otherwindows of the application until this one is closed) and the user can then usethis colour to draw completely freely (without snapping) on the canvas.

Figure 4.12 demonstrates several annotations in an array of colours andthe three dimensional conversion of those annotations. As shown, this toolis particularly useful for demonstrating the locations of certain entities withina model or describing specific tasks for separate individuals or teams (usingdifferent colours to represent the different individuals or teams).

(a) Two Dimensions (b) Three Dimensional Equivalent

Figure 4.12: Two and Three dimensional representations of annotations

The implementation of this tool is in fact very similar to the freehand drawtool with the only main difference being that no extrusion occurs on annotationobjects when switching to the three dimensional view.

4.2.6 The Place Camera Tool

The final tool available in Speedy Sketch is the place camera tool. This toolis most useful when analysing camera visibility when the location of a cameraand its field of view angle is known to the user. Once this tool is selected fromthe menu the user can left click once to place the camera just below the ceilingof the currently selected floor. When the camera is placed the user may thenleft click again on the camera’s look-at location (on the ground of the currentlyselected floor). The system will render a black square to represent the cameraand a red line depicting its look at vector. Finally, the user is presented with awindow containing a slider to input the camera’s field of view.

Humans usually have a field of view of around 180◦ but actually take ininformation from as wide an angle as 200◦ [45]. Due to the nature of computer

37

monitors representing a two dimensional plane and therefore being incapable ofprojecting a hemispherical output, such high viewing angles are almost impos-sible to represent and attempting to do so results in an effect known as fisheye.As such the FOV of the camera tool is limited between 20◦ and 120◦ with thedefault set at 45◦.

In order to function correctly in three dimensions the camera tool makes useof the OpenGL gluLookAt() function which defines the position of the camera(from the location on the two dimensional plane), the look at vector (from theplacement of the red line in the two dimensional view) as well as an up vector(trivial). The camera placement tool is only used when camera mode is selectedwhen converting the model to three dimensions, if freeview mode is selected thenthe camera placement is ignored and the user has complete control of cameramovement in three dimensions.

4.2.7 Traversing floors

Currently, in Speedy Sketch, two methods exist for traversing floors; left-clickingthe up and down arrows in the menu bar and moving the mouse wheel. Limitsfor maximum and minimum floor are included not to allow the user to buildbelow ground level or above the 30th floor.

Originally shapes on different floors were always visible but changed colourdepending on their location relative to the user’s current location. Shapes thatexisted on the current floor were black, shapes on the floor directly below wereblue and shapes that existed elsewhere were red. This concept was somewhatflawed in nature in that it gave no indication of how many floors any particularbuilding had. This method also had many problems where shapes above thecurrent floor would simply dominate any shapes on the current floor and thusmake them invisible to the user.

A new method for viewing shapes on current and other floors was thusimplemented. A toggle button was added to the toolbar on the left. When thetoggle button is pressed down shapes on floors other than the current one aresimply drawn in black (as are the shapes on the current floor). When the togglebutton is released only shapes on the current floor are visible thus allowing theuser to decide whether any reference points for input on the current floor arerequired.

Labels were added to each shape after they had been drawn indicating thenumber of floors that shape occupies above the current floor (a shape existing onfloors 0 to 6 would, for example, display 2 when the user is on floor 4). Shapesthat exist on floors other than the current one have no labels. This gives theuser a much better idea of where shapes are located in the three dimensionalscene.

4.2.8 Saving and Loading

Implemented within Speedy Sketch are save and load functions capable of savingany model the user is currently working and loading them again at a latertime. Saving simply writes any relevant variables stored in ArrayLists into anstructured xml file by looping over the lists and outputting the variables asstrings.

38

Originally loading was attempted by using built in xml parsing functionsincluded in the Java API (such as DOM and SAX). This was met with verylimited success with discrepancies constantly occurring when files were loadedback into Speedy Sketch. Thus, a parser based on regular expressions and stringmanipulation was written to read the xml. The parser reads the file line by line,examining the xml tags of each line, removing them and allocating the value tothe correct variable (or simply adding it to an ArrayList).

Figure 4.13 shows the process of saving, storing and loading as a flow chartof typical events. The file save and open windows both have file filters in place,rejecting visibility of anything that is not a directory or a .ss (Speedy Sketch)filetype. Although a .ss filetype is technically an xml filetype it was deemedinappropriate to give the user an option of opening xml files that Speedy Sketchwould not be able to parse.

Figure 4.13: Flow chart demonstrating key features of saving, storing and loading

4.2.9 Converting to three Dimensions

The most important feature available in Speedy Sketch is the conversion of thetwo dimensional input sketch into a fully traversable three dimensional model.This is performed by creating a new window (ThreeDSketch) containing just anOpenGL canvas. Variables are passed to the ThreeDRenderer class containedwithin this canvas from the two dimensional renderer thus allowing manipulationof the two dimensional model and thus extrusion in the z direction can begin.

Figure 4.14 demonstrates a direct transformation of a simple building modelfrom two dimensions to three dimensions by extruding the walls and filling inthe floor and ceiling as a shape tessellated into triangles (for correct rendering).The ground is simply rendered as a single, large, green plane on which structuresmay be placed.

The conversion actually works by a transfer of variables from the two dimen-sional view to the three dimensional renderer. The variables are transferred bycopy as opposed to reference so that they may be manipulated in the required

39

(a) Two Dimensions (b) Three Dimensional Equivalent

Figure 4.14: Two and Three dimensional representations of a simple, single storeybuilding

way without affecting the original model. Before the two dimensional windowis closed and the three dimensional window is presented to the user, severaloptions must be selected. Figure 4.15 shows the options that can be modifiedbefore the two dimensional view is closed.

The dropdown box at the top allows the user to select a texture to be usedfor the walls of buildings. Following that selection is a set of three tick boxesallowing the user to decide if they would like lighting (local illumination modelwith a single light source), fog (objects in the distance becoming less visible) oroutlines (the outlines of polygons being rendered with highly visible colours).

When the user is satisfied with these options an option must be selectedwhether to view the scene from a camera angle predefined using the place cameratool or be able to traverse the scene freely using either a graphics tablet or amouse and keyboard.

4.3 The Three Dimensional View

As discussed in Chapter 3 on page 15 converting the two dimensional modelinto three dimensions is a fundamental feature of Speedy Sketch. As such it isof utmost importance that the three dimensional view performs as well as thetwo dimensional view in every way possible.

4.3.1 Basics and Tessellation

A fundamental requirement of Speedy Sketch is essentially extruding the twodimensional walls along a third axis. How this is done, however, is not immedi-ately obvious. OpenGL works best if it is passed individual polygons to renderby defining their vertices. Thus each pair of vertices from the two dimensionalmodel is passed to the renderer along with an equivalent pair 30 units abovethe original pair to make up the extruded shape. This shape is then rendered

40

Figure 4.15: Screenshot of options that can be modified before converting to thethree dimensional view.

as a quadrilateral. Rendering continues in this manner until the whole shape isrendered as a floor.

As well as making up quadrilateral polygons in the x-z and y-z planes, thetwo dimensional model contains shapes in the x-y plane that must be rendered.Figure 4.16 is an illustration of the coordinate system used in Speedy Sketch(note the direction of the z axis).

It is possible to render most shapes in the x-y plane by simply supplyingall the vertices of the shape and rendering the result as an individual polygon.Such an approach would work just fine if not for the existence of concave shapes.Figure 4.17 illustrates some typical convex and concave shapes. A simple testfor convexity is defined below and illustrated in Figure 4.17:

“All the diagonals (line segments between vertices) of a convex poly-gon lie entirely inside the polygon. See figure on the left. (In aconcave polygon, some diagonals will lie outside the polygon) [46].”

Although shapes such as those in Figures 4.17(b) and 4.17(c) are going to beless common than those in Figure 4.17(a) it is still necessary to be able to renderappropriate ceilings and floors for such shapes. In order to correctly render suchshapes, a tessellation of the polygon into triangles must occur before renderingthe shape.

Figure 4.18 demonstrates such a tessellation of the shapes OpenGL wouldstruggle with from Figure 4.17. Luckily, instead of writing an algorithm to dothis, OpenGL handles most of the legwork. In order for OpenGL to do thiscorrectly, however, the vertices must be converted into an OpenGL list format

41

Figure 4.16: The three dimensional coordinate system used in Speedy Sketch.

(a) An arbitrary convexshape

(b) An arbitrary concaveshape with test for convexity

(c) An arbitrary concaveshape that OpenGL wouldfail to render correctly

Figure 4.17: Examples of convex and concave shapes with tests for convexity ((b)and (c) fail the test).

42

and passed into a configured tessellator object from where they can then beretrieved and rendered.

(a) An example of a tessellation of a con-cave shape.

(b) An example of a concave shape tessel-lated into three triangles.

Figure 4.18: Examples of tessellation of the shapes in Figures 4.17(b) and 4.17(c).

4.3.2 Freeview Mode

When moving to the three dimensional view, the user must decide whethersettings should be applied to view the scene from a pre-defined camera viewpointor be able to roam freely around the scene. If the user decides to view the sceneusing the freeview mode, movement and rotation of the camera at will and in ahighly learnable and efficient way must be available; many features are in placeto make this the case.

It is worth noting that limits are in place to constrict user movement; theuser can never go below ground level and can never move far above the maximumallowed floor for a building (30) or outside the viewable area (defined by thegreen x-y plane).

Camera Location

Firstly, the user must be able to translate the camera position to any locationwithin the scene with relative ease. When the three dimensional view first showsup, the camera is placed at the two dimensional origin (x=0, y=0 ) with the lookat vector pointing at the first vertex recorded (so that the user can always seethe model straight away).

OpenGL, or rather the accompanying utility (GLU) libraries, contains afunction named gluLookAt() which takes the variables for the current x, y, zposition of the camera, the current x, y, z look-at vector (the coordinates of theposition the camera is looking at) and the x, y, z coordinates of the vector thatdefines the up-vector (always (0, 0,−1) in Speedy Sketch’s coordinate system).Thus, all that must be done in order to move the camera is pass the appropriatecoordinates to this function and update the view.

Several methods for translating the camera are included:

• W,A,S,D for forward, left, backwards and right.

43

• ↑,←, ↓,→ for forward, left, backwards and right.

• Rolling the mousewheel backwards and forwards for moving forwards andbackwards at five times the normal speed.

• Holding down the left mouse button and dragging in a direction (imple-mented to allow movement with the graphics tablet).

In all, translating the camera in three dimensions is trivial when comparedto rotating it in a highly learnable way.

Looking Around

The most appropriate method of allowing the user to rotate the camera (lookaround the scene) was deemed to be moving the mouse (or the pen around thegraphics tablet). As such, a latitude/longitude system had to be established andcalculated based on the cursor location in order to calculate a look at vectorone unit in front of the user’s location.

The actual calculation given a longitude, latitude and camera location inorder to determine a look-at vector was reused from previous experience [47].The actual calculation of the latitude and longitude had to be heavily modifiedhowever in order to increase the efficiency with which the user could rotate thecamera (particularly about the z axis).

Code Sample 3 shows how the latitude and longitude based on mouse move-ment is calculated. This calculation shows mouse latitude and longitude asopposed to absolute latitude and longitude which encompasses the user’s lo-cation in the scene. One of the most important things to notice in this codesnippet is the variable xwrap which is the key to allowing the user to view thescene from any angle. Using this, the user can move the mouse cursor off thecanvas in either the x or -x direction and have the cursor reappear at the otherside of the canvas.

public void mouseMoved(MouseEvent arg0) {

mlat = 50 - ((arg0.getY() / (double) curHeight) * 100);

mlon = -((curWidth / 2 + curWidth * xwrap + arg0.getX()) / 10)

+ 100;

curMouseX = arg0.getX();

curMouseY = arg0.getY();

}

Code Sample 3: Code sample to calculate the latitude and longitude based on themouse cursor location on the canvas.

In order to accomplish this, Speedy Sketch makes use of the Java Robotclass which contains functions including automated movement of the mousecursor and taking a screen grab of a given rectangle on the screen (used forprinting). This class is used in parallel with data describing the location ofthe canvas on the screen to move the mouse cursor to the opposite side of the

44

canvas when the user moves the mouse cursor out of the window horizontally.As the user does so, the xwrap variable is either increased (movement in positivex ) or decreased (movement in negative x ) by one unit thus contributing as amultiplier to longitude calculation.

4.3.3 Camera View Mode

Another option presented to the user when transferring the model to a threedimensional view is viewing the model from a pre-defined camera angle with acustom field of view. Figure 4.19 demonstrates two different locations and fieldof view settings and the result when viewing a two storey building in this mode.

(a) Two Dimensions (b) Three Dimensional Equivalent

(c) Two Dimensions (d) Three Dimensional Equivalent

Figure 4.19: Screenshots of viewing a two storey building from a ground floor camerawith an FOV of 45◦ and a first floor camera with an FOV of 80◦.

As shown in Figures 4.19(c) and 4.19(d), when viewed through a higher FOVangle, the building appears to be further away but this is not the case. Viewing

45

through a higher FOV angle simply distorts the image to allow objects that areencompassed by the wider frustum to also become visible at the edges of thecanvas. Although the figures only demonstrate look-at vectors on the same floorlevel as the camera location, it is completely possible to define look-at vectorson higher floors (camera pointing upwards) or lower floors (camera pointingdownwards).

The actual transfer from the camera placement in two dimensions to itsthree dimensional representation is relatively straight forward in comparison toits freeview counterpart. All the work is handled in the init() function whensetting up the view frustum and perspective viewpoint and no more viewpointhandling needs to be done as movement is disabled in this view.

4.3.4 Textures

Although it was completely possible to achieve the fundamental and primaryrequirements without the inclusion of any textures, for the sake of an aestheti-cally pleasing result and the potential to use the final three dimensional modelsin presentations (for example) they are included and used in several ways. Themost obvious use of textures is, of course, to add realism to the walls of buildingsbut other uses include a textured sky box and textures used in order to imple-ment doors and windows. All the textures are available to view as individualimages in Appendix H on appendix page R.

The Wall Textures

Originally, only a brick wall texture [48] was included and the user had no optionto change this. As not all buildings are not composed of a regular brick surfacethe following other textures were added:

• Light Brick [49]

• Dirty Brick [50]

• Grey Wall [51]

• Eroded Brick [52]

These textures are loaded when the three dimensional renderer class is in-stantiated and rendering begins. The textures are applied on a per polygonbasis; the top left corner of the texture corresponding to the upper left cornerof the polygon with the bottom right corner of the texture corresponding to thelower right corner of the polygon respectively.

Wall textures are applied to cylindrical buildings in a somewhat differentmanner: The top left corner of the texture corresponds to the upper left cornerof the first polygon drawn in the cylinder with the bottom right corner corre-sponding to the lower right corner of the last polygon in the cylinder. Every

other polygon in the cylinder corresponds to 1360

thof the texture for each poly-

gon around the cylinder. As such, textures around the cylinder, unfortunately,look a little stretched out.

46

The Sky Box

In order to make the three dimensional scene feel a little more realistic and adda greater sense of depth to the model a sky box was implemented. The texturesfor the skybox are pre-made purely for use as a skybox by the jMonkeyEngineset of tutorials [31]. The textures are simply applied to the six sides of a largecube that surrounds the maximum dimensions of the model.

Implementing a skybox in this manner gave cause to a problem of scale.The side of the cube had to be close enough not to be entirely faded out by fog(should the user choose to use it) and small enough to seem realistic withoutever allowing the user to exit the box. The solution to this was to make theskybox follow the user’s movement such that the user was always in the centreof the cube in the manner depicted in Figure 4.20.

(a) Camera location on right side of model (b) Camera location moved to the left

Figure 4.20: Skybox movement following user such that the user is always in thecentre of the skybox

This creates the feeling that the horizon is truly far away and unreachablewithout ever obscuring the x-y plane or allowing the user to escape from theskybox.

4.3.5 Problems Encountered

Whilst implementing the core functionality of Speedy Sketch, several problemswere encountered. Some problems were relatively trivial to overcome such asa bug that caused the three dimensional model to be rendered the wrong wayup (solved by flipping the z axis). Other problems (such as z-fighting) had nodirect solution and could only be improved as opposed to fixed.

Z-fighting

Z-fighting is a commonly recurring problem in most computer graphics. Itoccurs when two (or more) polygons are rendered at an equal distance away

47

from the viewport (the depth) and as such overlap and are thus rendered in thesomewhat unappealing manner depicted in Figure 4.21.

Figure 4.21: Screenshot with the light area demonstrating z-fighting.

A partial solution is offered within OpenGL in the form of the glPolygonOff-set() function which offsets any polygons at the same depth by a small factor.Although this function can be configured to perform very well when the camerais stationary it is very difficult to account for camera translation around thescene and thus some z-fighting is still inevitable.

The three most common causes of z-fighting in Speedy Sketch are due tooverlapping walls but come about in different ways. Figure 4.22 demonstratesthe three main ways that z-fighting can occur.

(a) Z-fighting due to auto-complete on a single line

(b) Z-fighting due to auto-complete of a full shape

(c) Z-fighting due to overlappingwalls

Figure 4.22: The three main causes of z-fighting in Speedy Sketch (the thicker blueline defining where z-fighting would occur.)

48

The first one occurs when the user draws a single line and releases the mouse,the auto-complete algorithm then draws a single line back down the same linethe user drew causing two polygons to be rendered at the same location forevery polygon the user input. This problem was fixed by applying a collinearitytest to every shape. Code sample 4 demonstrates a modified collinearity testalgorithm that tests if all the points in a given shape are on the same straightline (the shape is just a straight line). If this is the case, the final vertex of theshape is removed in order to avoid z-fighting.

for(int i=1;i<currentx.size()-2;i++){

Tx=currentx.get(i);

Ty=currenty.get(i);

if((Math.abs((Qy-Py)*(Tx-Px)-(Ty-Py)*(Qx-Px)))

>= (Math.max(Math.abs(Qx-Px), Math.abs(Qy-Py)))){

return false;

}//Not on line at all

}//for all points

//if no false returns then all points on line

return true;

Code Sample 4: My modified collinearity test algorithm with Px, Py representingthe first vertex of the shape, Qx, Qy representing the last pointof the shape (before auto-completion) and Tx, Ty representing thecurrent point being tested (Andrew S. Glassner, Graphics Gems I,p50 [53]

Unfortunately, without implementing methods for collision detection suchthat Speedy Sketch, at all times, has precise information about the locationand interactions between shapes it is somewhat difficult to void the causes ofz-fighting depicted in figures 4.22(b) and 4.22(c).

4.4 Other Topics of Interest

Many other features and optimisations are included to improve learnability andefficiency when using Speedy Sketch. One such feature is the automatic move-ment of imported (.obj ) objects to the visible plane.

Moving .obj models to the ground plane

When defining a three dimensional model in a .obj file there is no acceptedconvention for normalising the origin that the model is based around; somemodels have an origin in the very centre of the model and some at a key pointat the model (this point may be near the top or bottom of the model).

Simply importing the model and placing the origin coordinate (0, 0, 0) on theground plane would give varying results for different models which is simply un-acceptable. In order for the model to appear correctly in the three dimensionalscene it is translated to the ground plane in the manner depicted in Figure 4.23.

The translation to the ground plane is not as trivial as it may seem at firstglance. It is impossible to simply use OpenGL to translate the full model to the

49

(a) Object with origin at centre (b) Object translated to ground plane

Figure 4.23: An object that is originally imported with part of it obscured belowthe ground plane has to be transposed in the negative z direction.

plane without prior calculations. First the vertex at the lowest z value must befound then, if that vertex is less than 0, all the vertices that make up the modelmust be shifted upwards by the difference between that vertex and the originin Speedy Sketch (0).

Printing

It is common for users to have a requirement for models (both two and threedimensional) to be output to paper for later reference or for manual annotation.A print function is available in both the two (Figure 4.24) and three dimensionalviews. Printing is available either through the file menu or by pressing thekeyboard shortcut ctrl-p. Doing so brings up a printer selection menu that listsall available printers on the current system (fetched into an array from systeminformation) and allows the user to choose the preferred printer.

(a) Print menu in two dimensions withprinter selection box open

(b) Print output for Figure 4.24(a)

Figure 4.24: Screenshot of the print menu in two dimensions and the respectiveoutput.

50

Printing is implemented using the Java Robot class taking a screen grabof the rectangle defined by the OpenGL canvas and outputting this as a .pngimage file. This image file is then passed to the selected printer through theJava Printer API.

4.4.1 The Help System

In order to score as highly as possible in the categories of learnability, efficiencyand errors, Speedy Sketch implements a fully functional help system that allowsthe user to look up any tasks they may wish to accomplish or investigate anyerrors that the application may present. The help system was made in itsentirety with Adobe Robohelp [55] and later compiled into .chm (compiledhtml) and .html files for presentation. Figure 4.25 shows screenshots of thehelp system running in Windows 7. The help system can be accessed througheither the help menu or directly through the file supplied with the application.

(a) Help displaying the help menu and in-structions on how to start the program

(b) Help displaying the help index as wellas instructions on how to construct stairs

Figure 4.25: Screenshots depicting a .chm file in Windows 7

As only the Windows operating system has a direct way of reading .chm filesan alternate help system had to be provided in order to keep the applicationcompletely operating system independent. As such, an alternate, web helpwas compiled and hosted on the University of Manchester servers [56] witha conditional statement redirecting Mac OS and Linux users to the web helpas opposed to the .chm file. Figure 4.26 shows a screenshot of the web helpdisplaying information about the file menu in Speedy Sketch.

When launching the web help system Speedy Sketch automatically launchesthe default browser on the system being used. This was originally done with“Barebones Browser” launch code found online [57]. A method for doing thismore directly through the Java API was later located and the code was replacedwith a more direct and more efficient method (using the Desktop API).

4.4.2 Undo and Redo

The concept of reversibility is particularly important when analysing an appli-cation in the fields of errors and efficiency. If all user actions are completely

51

Figure 4.26: Screenshot of web help displaying information about the file menu.

reversible (even the reversal of those actions) then any errors caused by usererror can easily be undone and the error is no longer catastrophic in nature.

In order to implement an undo/redo function that works as expected twoextra ArrayLists (Tools and Temp) were instantiated to work as stacks to recordthe user’s actions and the order they were performed in. The tools ArrayListfunctions as a data structure to record the order of the user’s action and gainsan element every time the user uses a tool. The temp ArrayList, similarly,functions as a data structure to store any elements that have been removedfrom the tools ArrayList via an undo command so that redo actions may beperformed later.

Figure 4.27 describes a sample use case of the user performing actions thataffect the undo/redo stack. The actions the user takes are as follows:

1. The user inputs one shape, two objects followed by two shapes (in thatorder).

2. The user uses the undo command to remove the shape 3.

3. The user manually deletes shape 1 (using the edit vertices tool.)

4. The user uses the redo command to replace shape 1 from the temp Ar-rayList.

52

(a) The undo/redo stack after the user’sinput

(b) The stack after the user performs anundo command

(c) The stack after the user manuallydeletes shape 1

(d) The stack after the user performs aredo command

Figure 4.27: The undo/redo stack as the user performs various actions.

53

CHAPTER 5

RESULTS

With the fundamental requirements satisfied (as well as several others) it wasnecessary to construct various structures and simulate various situations thatthe user may find themselves in. As such, results are presented in use case formbased on certain constraints.

5.1 Main Use Case

Although Speedy Sketch is more than capable of modelling more than one struc-ture in a scene, it is most common that only a single structure will be modelledat once and thus the main use case will only model a single building. The rest ofthis chapter is presented in a use case format describing actions the user takesin order to achieve the displayed results. Figure 5.1 defines any symbols usedwhilst describing the user’s actions. Note that the user may move the mousebetween performing defined actions.

54

Figure 5.1: Legend defining any symbols used to describe user actions

Firstly, the userstarts up SpeedySketch.

Figure 5.2: User starts up Speedy Sketch

55

The user (usingthe already se-lected freedrawtool) draws ashape onto thecanvas.

(a) Action input by the user (separatered arrow indicates auto-complete)

(b) Result on the canvas

Figure 5.3: The action the user inputs and the result with the freehand tool

The user selectsthe rectangletool

Figure 5.4: The user selecting the rectangle tool (2 clicks in total)

56

The user clicksthe toggle buttonallowing him toview multiplefloors, movesup one floor(mouse wheel upone notch) anddraws a rect-angle on floorone

(a) Actions input by the user (mousewheelup one notch followed by a dragging action)

(b) Result on the canvas (note floor number)

Figure 5.5: The actions the user inputs and the result of traversing a floor andinputting a rectangle

The user selectsthe ellipse tool

Figure 5.6: The user selecting the ellipse tool (2 clicks in total)

57

The user dragsthe mouse acrossthe area of thecanvas where hewishes to placethe ellipse

(a) Action input by the user (b) Result on the canvas

Figure 5.7: The action the user inputs and the result of inputting an ellipse

The user wishesto see the re-sult so far inthree dimensionsso he convertsthe scene to threedimensions

Figure 5.8: The user moving to three dimensional mode (2 clicks)

58

The user movesaround the scene(with ↑,←, ↓,→and the mouse)

Figure 5.9: The user moves around the scene and views the scene from a specificangle

The user escapesthe three dimen-sional view (Esc)and selects thestair tool

Figure 5.10: The user selecting the stair tool (2 clicks)

59

The user movesback down to theground floor andcreates a stair-case

(a) Actions input by theuser (mousewheel downone notch followed by adragging action)

(b) Result on the canvas

Figure 5.11: The actions the user inputs and the result of inputting a staircase

The user selectsthe doorway tool

Figure 5.12: The user selecting the doorway tool (2 clicks)

60

The user placestwo doors, ro-tates the tool by90◦ and placesone more door

(a) Actions input by theuser on the canvas

(b) Result on the canvas

Figure 5.13: The actions the user inputs and the result of inputting 3 doors (twohorizontal and one vertical)

The user selectsthe window tool

Figure 5.14: The user selecting the window tool (2 clicks)

61

The user places awindow, rotatesthe tool by 90◦

and places twomore windows

(a) Actions input by theuser on the canvas

(b) Result on the canvas

Figure 5.15: The actions the user inputs and the result of inputting 3 windows (twovertical and one horizontal)

The user selectsthe annotationtool in magenta

Figure 5.16: The user selecting the annotation tool (2 or 3 clicks depending on colourchoice)

62

The user anno-tates the sketchwith an arrowpointing at adoorway

(a) Actions input bythe user on the canvas

(b) Result on the canvas

Figure 5.17: The actions the user inputs and the result of inputting a sketched arrow

63

The user selectsthe camera tool,clicks once toplace the cameralocation at thebottom right ofthe figure. Theuser then clicksonce more toplace the cameralook-at locationon the annotatedarrow. Finallyhe sets the FOVto 45◦

Figure 5.18: The actions taken by the user to place the camera aiming at the anno-tation

64

The user wishesto see the re-sult in three di-mensions viewedfrom the cam-era he placed sohe converts thescene to three di-mensions with alight brick tex-ture

Figure 5.19: The user moving to three dimensional mode with a light brick textureand camera view (2 clicks)

65

The user viewsthe scene fromthe pre-definedcamera position)

Figure 5.20: The user views the scene from the specified camera angle

The user viewsreturns to thetwo dimensionalview (Esc) thenreturns yet againto the threedimensionalmode in freeviewmode, viewingthe scene withyet another walltexture withthe freedomto traverse thescene

Figure 5.21: The user views the scene with a third texture with freeview mode

66

5.2 Examples of Specific Use Cases

The main use case successfully demonstrates many of the features of SpeedySketch in one set of input sketches. Several key features were not demonstratedhowever and thus are demonstrated here as individual use cases.

The user holdsdown numberkeys to extrudefreehand shapesover multiplefloors

(a) Actions input by the user on the canvas (b) Result on the canvas

Figure 5.22: The actions the user inputs and the result of inputting two multi flooredshapes

67

The user holdsdown numberkeys to placewindows onmultiple floors

(a) Actions input by the user onthe canvas

(b) Result on the canvas

Figure 5.23: The actions the user inputs and the result of inputting a set of multifloored windows

The user viewsthe results sofar in three di-mensions (with afourth texture)

Figure 5.24: The user views the scene with a fourth texture with freeview mode

68

The user selectsthe import ob-ject tool and se-lects a .obj file[58] from the file-store

Figure 5.25: The user selects the import object tool and an object to import

69

The user leftclicks to definean origin for theobject and setsits scale

Figure 5.26: The user sets up the imported object

70

The user printsthe two dimen-sional scene(Ctrl-P) to a pdffile

(a) User chooses Adobe PDF as printer

(b) Successful print output

Figure 5.27: The user chooses a pdf printer and prints

71

The user viewsthe results inthree dimensions(with outlinesenabled), con-centrating on theimported object

Figure 5.28: The user views the scene with outlines enabled

The user loads apreviously savedscene consistingof a complex ofbuildings

Figure 5.29: The user loads a scene

72

The user viewsthe loaded scenein three dimen-sions

Figure 5.30: The user views the scene in three dimensions

73

CHAPTER 6

TESTING AND EVALUATION

In order to test the system an approach based on Jakob Nielsen’s heuristicevaluation technique is adopted. As well as the five HCI concepts previouslydiscussed in Chapter 3, ten Usability Heuristics are also analysed in some depth.

6.1 Heuristic Evaluation

Nielsen (both in Usability Engineering, p173 [7] and in his online articles [59])defines a formula (Equation 6.1) for calculating an optimum number of evalua-tors (test subjects) required to discover most usability problems using heuristictesting.

ProblemsFound(i) = N(1− (1− λ)i) (6.1)

Where ProblemsFound(i) indicates the number of different usability prob-lems found by aggregating reports from i independent evaluators, N indicatesthe total number of usability problems in the interface, and λ indicates the pro-portion of all usability problems found by a single evaluator [59]. Figure 6.1illustrates this equation.

As such, with heuristic evaluation, as few as three to five users can, in fact,give excellent results when looking for usability problems. An online question-naire [60] was formulated for ease of access for the test subjects. The ques-tionnaire was accessible from the author’s personal site [61] along with the fullSpeedy Sketch application (which test subjects were encouraged to use immedi-ately before completing the questionnaire). A total of thirteen evaluators tookpart in completing the questionnaire (although not all of them answered allquestions).

Many of the questions were based on Nielsen’s five HCI concepts as well as histen general principles for interface design [59]. Several questions also related tothe speed and accuracy with which Speedy Sketch functions. The questionnairein its entirety along with the answers given is available in Appendix K.

The list provided in Appendix I describes Nielsen’s ten general principles forinterface design along with the author’s interpretation of each one.

74

Figure 6.1: Curve showing the proportion of usability problems in an interface foundby heuristic evaluation using various numbers of evaluators. The curverepresents the average of six case studies of heuristic evaluation. [59]

Before analysing Speedy Sketch in each of the heuristic evaluation categoriesa scale for defining the severity of any problems encountered must be estab-lished. As heuristic evaluation methods are being used it seems appropriate touse Nielsen’s severity factors in parallel. Each severity factor is a function ofthree variables; the frequency with which the problem occurs, the impact of theproblem and the persistence of the problem [59]:

0 = I don’t agree that this is a usability problem at all

1 = Cosmetic problem only: need not be fixed unless extra time is available onproject

2 = Minor usability problem: fixing this should be given low priority

3 = Major usability problem: important to fix, so should be given high priority

4 = Usability catastrophe: imperative to fix this before product can be released

This scale is applied in a set of tables describing any problems encounteredin each of these ten categories (optimisations are described in the body of thetext, the problems in tables) given in Appendix J. Most of the problems werefound by users and mentioned in the questionnaire and several are just generallyknown about but are somewhat difficult to overcome.

6.2 Unrealistic Buildings

As demonstrated in Chapter 5 Speedy Sketch is more than capable of mod-elling realistic buildings (i.e. regular shapes structures beginning on the groundfloor). It is completely possible that the user may wish to construct a completelyunrealistic building.

75

Tessellation handling self intersecting shapes

As discussed in Section 4.3.1 on page 40, Speedy Sketch implements the tes-sellation of polygons in order to render floors and ceilings correctly for concaveshapes. Buildings do not generally consist of self intersecting shapes but a usermay choose to sketch such a shape.

Figure 6.2 demonstrates the actions required to input such a shape whilstFigure 6.3 demonstrates the three dimensional view of the object.

(a) Action input by the user (sep-arate red arrow indicates auto-complete)

(b) Result on the canvas

Figure 6.2: The actions the user inputs and the result on the canvas of a self-intersecting shape

The shape is rendered as expected based on the tessellation rules with a solidbuilding and any rooms enclosed by walls having a ceiling (and floor). As theshape intersects itself it is important to realise that the winding changes fromclockwise to anti-clockwise and therefore lighting becomes inconsistent (hencewalls facing the user are both light and dark in different areas).

Floating buildings

In order for buildings to be modelled accurately there should be restrictions onstructures floating in the air. Due to a lack of collision detection within SpeedySketch coupled with difficulties in correctly reading out tessellated vertices thisis somewhat problematic.

Although limiters are in place to not allow the user to sketch shapes thatare more than one floor above the current highest shape this is a somewhatsimplistic method and is therefore easily circumvented. Figures 6.4, 6.5 and 6.6demonstrate how this can easily be done.

In order for true structural constraints to exist, collision detection mustfirst be implemented. Although Speedy Sketch does use some bounding boxes(edit vertices tool) these are basic in nature and a much more complicatedsystem for testing constraints would have had to be developed (an unreasonablerequirement for such a time frame).

76

Figure 6.3: The user viewing the self-intersecting shape in three dimensions

(a) Action input by theuser (separate red arrowindicates auto-complete)

(b) Result on the canvas

Figure 6.4: The actions the user inputs and the result on the canvas on the way tocreating a floating building

77

(a) Actions input by the userafter selecting the edit verticestool

(b) Result on the canvas (notethe floor number)

Figure 6.5: The actions the user inputs and the result on the canvas after deletingthe first 8 floors

Figure 6.6: The user viewing the floating structure in three dimensions

78

6.3 Speed, Ease of Use and Accuracy

As described in Section 1.3 on page 4 the system must be analysed to determinewhether it adheres to the objectives defined. Following this the system mustbe compared to existing systems in the categories of Speed, Ease of Use andAccuracy.

6.3.1 Speed

As defined in Section 1.3 “The system must be able to generate the output quicklyand run the three dimensional scene in real time (> 25 frames per second) [9]”.Speedy Sketch succeeds in both parts of this objective to an extent.

Once a satisfactory diagram has been input and the user has selected optionsto convert to the three dimensional view Speedy Sketch takes approximatelythree seconds (although times of up to six seconds have been recorded on slowermachines) to convert to and render the view before the user is able to traversethe scene. In comparison to other software analysed this is slower than SketchUpwhich models in three dimensions thus has no need to render and convert thescene but much faster than using a rendering engine with AutoCAD which cantake up to several days to render a frame (albeit a much more aestheticallypleasing one).

The second part needs much more analysis in order to determine how suc-cessful Speedy Sketch is at rendering the scene. Before analysing the number offrames per second Speedy Sketch outputs relative to the number of polygons ithas to render it is important to gain an idea of how many polygons it usuallyhas to render in a regular use case. Each side of a grid square amounts to asingle polygon thus a simple single floor building is usually no more than aroundtwenty or thirty polygons. This, of course, does not include the polygons usedto render the ground, the skybox, floors and ceilings. As floors and ceilingsare not always the same shape it is difficult to predict the number of polygonsrequired to render a specific shape but it is safe to assume that unless the shapeis needlessly complicated this number is less than thirty.

In order to test Speedy Sketch’s success at rendering polygons and thusdetermine how well it performs in the category of speed a test case had to bewritten in order to output data in a format that could be converted into a graph.The test began with a structure consisting of ten polygons (as well as the extrapolygons due to the ground and skybox etc), calculated the number of framesrendered every second then increased the number of polygons being rendered byduplicating the structure. The first test was performed with the user constantlymoving around the scene. Figure 6.7 depicts the output of the test with alogarithmic curve of best fit illustrating a smoothed out representation of thenumber of frames rendered in one second when a specified number of polygonsexist in the scene.

As shown in Figure 6.7 the framerate drops below the threshold of smooth-ness at around 650 polygons. The scene depicted in Figure 5.30 on page 73 con-sists of approximately 600 polygons (plus windows and doors) so comes close tothis threshold. The scene is, however, about as complicated as a Speedy Sketchsketch is likely to become and the framerate, in this case, is acceptable.

The second test is performed in the same way as the first but with the userviewing from a single camera angle rather than constantly orbiting the structure.

79

Figure 6.7: Graph depicting the framerate in the three dimensional view as the num-ber of polygons increases (with the user panning around the structure)

Figure 6.8 depicts the results of this test.

Figure 6.8: Graph depicting the framerate in the three dimensional view as the num-ber of polygons increases (with the user still)

The results of this second test are particularly surprising. The logarithmiccurve of best fit is left out and instead the graph is depicted with connectingcurves to illustrate how the results vary with increases in polygon numbers.Rather than being an approximately smooth decline (as in Figure 6.7) the graphis reasonably stable with very harsh declines in framerate at approximately 200polygons, 500 polygons and 750 polygons. These declines, while interesting, arein fact irrelevant as the user is never in motion and therefore is incapable ofperceiving any change in how many frames are rendered per second.

6.3.2 Accuracy

As discussed in Section 2.2.3 on page 11 Speedy Sketch is concerned primarilywith speed and ease of use perhaps at the cost of some accuracy and aestheticbeauty in the three dimensional view. However, accuracy is an important issueconsidering proposed uses for the application (primarily police use for hostagesituations). As such grid squares are approximated at 3m2 and the height of asingle storey is approximated at 2m. With this as a basis the user can quickly

80

judge how large a building is likely to be by traversing around the scene as ifexamining the building and relate their own size to the size of the building.

Certain issues of accuracy arise when trying to place windows and doors onrounded surfaces. A window (or a door) is represented as two polygons that areparallel and close together (to be placed either side of a wall) thus it is impossibleto map a flat polygon onto a rounded surface. These issues are not catastrophicin nature but leave room for improvement and further development.

6.3.3 Ease of Use

This is undoubtedly the area where Speedy Sketch aims to score the highest.The system was designed from the beginning with the user in mind and as suchshould perform very well in all five of Jakob Nielsen’s HCI categories [7].

Learnability

With learnability in mind the application was created to be as familiar as pos-sible. Using a WIMP interface and large buttons (with appropriate tool-tips)as well as a fully documented help system the user should have no problems inlearning the system and quickly becoming an expert user.

This is demonstrated best in question 15 of the questionnaire (Appendix K)asking rather directly “How easy was Speedy Sketch to learn?”. With a majorityof evaluators (92.3%) answering quite easy or very easy the system appeared tobe highly learnable.

Those users who consulted the help system at any point (38.5% of them) allfound it either somewhat useful or very useful indicating that the help systemalmost certainly aids the learnability of the application. The menu buttons inthe tool-bar also appeared to be highly familiar with 84.6% of users claimingthey did exactly what they expected with no prior information (other than,perhaps, the attached tool-tip).

Memorability

Unfortunately the two most successful methods for testing memorability (amemory test and a performance test after some time not having seen the appli-cation) were impossible to accomplish due to time constraints on the project.Instead optimisations in the category of memorability were implemented andthe help system put in place to remind users who had perhaps used SpeedySketch in the past but had forgotten how to perform certain tasks.

It is highly probable that Speedy Sketch, due to the number of features beingkept minimal (relative to other modelling applications), scores very highly inthis category. As discussed previously, the tool-bar icons [8] are highly familiarand the system is highly learnable with the system’s status always available forthe user to see. Thus, if a user were to forget how to accomplish a task, theycould easily find out and access step by step instructions in the help system.

Efficiency

Many accelerators and short-cuts are implemented within Speedy Sketch to im-prove efficiency for expert users. Question 7 on the questionnaire asking “Whichof the following tools did you make use of?” quite accurately depicts tools that

81

are intended more for expert users to increase efficiency as opposed to basictools to make novice users comfortable. Tools that were used less frequently inthis question such as the multi floor tool (used by 38.5% of evaluators) and therepeat floor tool (used by 30.8% of evaluators) are intended more as acceleratorsfor repetitive buildings with multiple storeys and thus act more as short-cutsthan base tools.

As these tools were not used as much as some others the answers to question18 are perhaps somewhat biased (considering all evaluators are classed as novicesof the application). An expert user of the system would, in fact, quite easilyaccomplish the task required for question 18 in under 10 minutes using theseaccelerators.

Errors

As far as the author is aware, only one catastrophic error currently remains inSpeedy Sketch (described in Appendix J). Most of the bugs described in thequestionnaire are suggestions for expansion and improvement of the applicationrather than actual errors. Error messages do exist, however, but are rare. Errors,their severity and the reason for their existence have already been covered inSection 6.1 on page 74.

Satisfaction

Due to its subjective nature the category of satisfaction is notoriously difficultto quantify. Evaluator’s responses in the questionnaire are perhaps one of themost accurate and appealing ways to test how well the system performs in thiscategory.

Questions 25 and 26 are perhaps most representative of how satisfied usersare with the application. 77% of evaluators claimed that Speedy Sketch waseither hardly at all or not at all frustrating to use and 77% again claimed thatusing the system was either a very or slightly fun activity. As Speedy Sketchis intended for use in work and home environments alike is is important thatthe user enjoys themselves whilst performing tasks to model buildings. Basedon questionnaire results (coupled with several evaluators explicitly stating thatthe application was fun to use) Speedy Sketch scores as well as intended in thiscategory.

82

CHAPTER 7

CONCLUSION

Having successfully implemented the application some further analysis is neces-sary in order to arrive at a conclusion concerning how successful Speedy Sketchis relative to the requirements. Objectives must be compared to the resultsobtained and possible future additions and expansions established.

7.1 Success Analysis

7.1.1 Comparison of Objectives to Results

The primary objective of this project is defined in Section 1.3 on page 4 to be“To successfully convert two dimensional input into a three dimensional repre-sentation of a building”. Speedy Sketch achieves this whilst adhering to thedefined constraints.

As discussed in Chapter 6 Speedy Sketch is a highly usable, familiar andquick application that models buildings with moderate accuracy. For any rel-atively complicated and large series of structures (up to around 650 polygons)the application is capable of rendering the scene in real time (> 25 frames persecond). Although it is possible to expand the application to allow more com-plicated scenes to be rendered at the same speed through various optimisationtechniques (e.g. frustum and back-face culling), the current state is deemedmore than sufficient for the defined requirements.

7.1.2 Additional Features Included

Several features that were not defined in the requirements or project plan (Ap-pendix A) have also been added. These features include accelerators to improveefficiency, textures for aesthetically pleasing results as well as many optimisa-tions to make the modelling process as enjoyable as possible.

Along with the fundamental requirements, additional tools were added toimport doors, windows and staircases as well as .obj files. All of these toolstogether make Speedy Sketch a highly versatile application capable of modellingsome rather complex structures. Unfortunately, many .obj files consist of a very

83

large quantity of polygons and therefore lower the number of frames per secondthat Speedy Sketch is capable of rendering. Restricting the scene to a maximumof one or two imported objects is therefore a requirement in order to render thescene in real time.

7.2 Further Work

One important feature of Speedy Sketch has not yet been discussed in muchdetail; the modularity of the code. The code has been written in such a waythat extra tools and functions can easily be added and incorporated into thesystem. Adding an extra tool is as simple as writing the functionality for it,adding a button or menu item to select it and selecting a system state for it.Changing the functionality of fundamental system functions may be somewhatdifficult in comparison to adding new ones but is also possible.

7.2.1 Possible Additions in Future

Possible additions for further development are plentiful. Many suggestions aremade in the evaluation questionnaire (Appendix K) and further ideas for changesand improvements are discussed:

Circles by sketch

Current methods for implementing an ellipse (or a circle) involve selecting theshape and dragging a line (from one corner to another) in order to place thecircle. This method makes it somewhat difficult to predict the exact locationfor the shape thus a method to optimise the prediction and integrate the circletool with the freehand tool is suggested:

Figure 7.1: Actions taken to input a circle in a more natural manner (black linesindicate dragging, blue lines indicate some measurements taken)

Figure 7.1 demonstrates an action that could be used to sketch a circle in amore natural way. The user would start the sketch at the required shape’s origin

84

then drag outwards (in any direction) and continue to draw an approximatecircle. This approximate circle is then averaged around the origin in order todetermine the average radius and place the circle.

Whether this method is preferable to one where the user simply places theorigin and drags outwards for a constant radius remains to be determined. Anadvantage of the former is that by averaging x and y components separately itis possible to draw ellipses whereas the latter only allows for circles.

Removal of errors and bugs

Other potential additions are possible including new tools, improvements inoptimisations for increased rendering speed as well as improved functionality ofexisting features (such as doors and windows) but perhaps the most importantexpansion available is the removal of certain bugs that currently exist withinSpeedy Sketch.

Currently one catastrophic error exists concerning the parsing of file nameswhen looking for .ss and .obj files. When the system comes across a directorywhere a file exists with no extension (most commonly in non-windows basedsystems) it throws a null pointer exception and hangs for a few seconds beforerecovering.

This error can be fixed by setting the file extension to an arbitrary defaultvalue (“false” is used in this case) before testing whether a file has an extension.This has been implemented and the error is now fixed.

7.3 Final Words

In conclusion Speedy Sketch has satisfied the requirements presented in theproject brief [1] to a high level as well adding several more features in orderto improve HCI with the application and the speed with which developmentis possible. During the implementation stage a progress blog was kept [63] inorder to track the development process and share findings and insights withother interested parties. A Java Webstart version of the application was alsocompiled and released on Project Kenai [64] (for higher accessibility) but, evenafter overcoming certification problems, this version was somewhat unreliableand performed very poorly on Linux systems (for unknown reasons).

The application is more than capable of modelling a building (or a setthereof) with multiple storeys, doors, windows, staircases and annotations forplanning purposes. The system is capable of doing so in real time (for rea-sonably large scenes) without drastic reduction in perceived framerate. Severalminor bugs remain in the application but with future improvements possible(and encouraged), the application can be ironed out with relative ease.

85

BIBLIOGRAPHY

[1] Toby Howard, Speedy Sketch Project Brief (2009) http://www.cs.man.

ac.uk/~toby/3YP/ (Accessed) 28/03/2010

[2] Craig Larman (2004) Applying UML and Patterns, Prentice Hall

[3] Mark McDowell (2006) Crime Lab 4: Speedy Sketch Project Re-port, University of Manchester, Available at http://intranet.cs.man.

ac.uk/Intranet_subweb/library/3yrep/2006/347702.zip (Accessed)30/03/2010

[4] Chris Green (2007) Speedy Sketch 2 Project Report, University of Manch-ester, Available at http://intranet.cs.man.ac.uk/Intranet_subweb/

library/3yrep/2007/5721880.pdf (Accessed) 30/03/2010

[5] Autodesk Dragonfly (2009) http://dragonfly.autodesk.com/designer

(Accessed) 30/03/2010

[6] University of Manchester, computer science third year project libraryhttp://intranet.cs.man.ac.uk/Intranet_subweb/library/3yrep/

index.php (Accessed) 30/03/2010

[7] Jakob Nielsen, (1993), Usability Engineering, Morgan Kauffman

[8] azazel100, deviantart, Kreski -Lines- icon set, (2004) http://azazel100.

deviantart.com/art/Kreski-Lines-7899719 (Accessed) 04/05/2010

[9] 100fps (2006) http://www.100fps.com/how_many_frames_can_humans_

see.htm (Accessed) 06/04/2010

[10] Google SketchUp (2010) http://sketchup.google.com/ (Accessed)23/02/2010

[11] Autodesk AutoCAD (2010) http://usa.autodesk.com/adsk/servlet/

pc/index?siteID=123112&id=13779270 (Accessed) 23/02/2010

[12] Autodesk 3ds Max (2010) http://usa.autodesk.com/adsk/servlet/pc/index?siteID=123112&id=13567410 (Accessed) 24/02/2010

86

[13] Blender (2010) http://www.blender.org/ (Accessed) 24/02/2010

[14] AC3D (2010) http://www.inivis.com/ (Accessed) 24/02/2010

[15] Autodesk Maya (2010) http://usa.autodesk.com/adsk/servlet/pc/

index?siteID=123112&id=13577897 (Accessed) 24/02/2010

[16] Wikipedia SketchUp Article http://en.wikipedia.org/wiki/SketchUp

(Accessed) 23/02/2010

[17] CNET News Article, Google acquires @Last Software (2006)http://news.cnet.com/Google-acquires-Last-Software/2100-1030_

3-6049511.html (Accessed) 23/02/2010

[18] Courtesy of Jason, Google Warehouse (2008) http://sketchup.google.

com/3dwarehouse/details?mid=d75c45b74dd1acdb24300ca7f22bf21e

(Accessed) 23/02/2010

[19] Alexander Schreyer (2010), Rendering SketchUp mod-els with Kerkythea http://www.alexschreyer.net/cad/

rendering-sketchup-models-with-kerkythea/ (Accessed) 23/02/2010

[20] Wikipedia AutoCAD article http://en.wikipedia.org/wiki/Autocad

(Accessed) 24/02/2010

[21] TenLinks.com, Directory of CAD, CAM and CAE (2009) http://www.

tenlinks.com/NEWS/pr/AUTODESK/020609_autocad2010.htm (Accessed)23/02/2010

[22] Stephen Spencer, SIGGRAPH Education Slide Set (1993) http:

//www.siggraph.org/education/materials/HyperGraph/radiosity/

overview_1.htm (Accessed) 23/02/2010

[23] xXprojectt2501Xx, YouTube, Building a House in Sketchup (2007) http:

//www.youtube.com/watch?v=rJcMe1OFBRQ (Accessed) 24/02/2010

[24] Ken Hickley, Randy Pausch, John C. Goble, and Neal Kas-sell, University of Virginia, A Survey of Design Issues in Spa-tial Input (1994) http://www.cs.cmu.edu/~stage3/publications/94/

conferences/UIST/Survey.html#REF20701 (Accessed) 24/02/2010

[25] Tom Murphy, (2010), Interview with a fifth year architecture student atThe University of Manchester (See Chapter C on page F).

[26] Jef Raskin, Intuitive Equals Familiar, Communications of the ACM. 37:9,September 1994, pg. 17, Available at http://www.asktog.com/papers/

raskinintuit.html (Accessed) 06/04/2010

[27] Silicon Graphics Inc. Open Graphics Library (1992) http://www.opengl.org/ (Accessed) 17/04/2010

[28] Microsoft Corporation, DirectX (2009) http://www.microsoft.com/

games/en-US/aboutGFW/pages/directx.aspx (Accessed) 17/04/2010

[29] Java Community Process, Java 3D (2010) https://java3d.dev.java.

net/ (Accessed) 17/04/2010

87

[30] Sun Microsystems, JOGL - Java OpenGL wrapper for C libraries (2010)http://download.java.net/media/jogl/www/ (Accessed) 17/04/2010

[31] Mark Powell, jMonkeyEngine - high performance scene graph based api forJava (2003) http://www.jmonkeyengine.com/ (Accessed) 12/04/2010

[32] Lloyd Dupont et al, OpenGL for C# (2003) http://csgl.sourceforge.

net/ (Accessed) 17/04/2010

[33] Randy Ridge et al, Tao OpenGL framework for C# (2008) http://www.

mono-project.com/Tao (Accessed) 17/04/2010

[34] Sun Microsystems (2010) http://uk.sun.com (Accessed) 18/04/2010

[35] Netbeans IDE Project, sponsored by Sun Microsystems (2010) http://

netbeans.org/ (Accessed) 18/04/2010

[36] Eclipse IDE Project, Eclipse Foundation (originally IBM) (2010) http:

//www.eclipse.org/ (Accessed) 18/04/2010

[37] Josh Bloch et al, Sun Microsystems, Java tutorials (2010) http://java.

sun.com/docs/books/tutorial/collections/algorithms/index.html

(Accessed) 18/04/2010

[38] Foraker Colorado, Usability First Glossary (2010) http://www.

usabilityfirst.com (Accessed) 19/04/2010

[39] Steve Krug, Don’t make me think! a common sense approach to web us-ability, edition 2(2005), New Riders

[40] Photoshop Textures, Architectural Door Texture (2007-2008) http://www.photoshoptextures.com/architectural-textures/door-texture.jpg

(Accessed) 29/04/2010

[41] FPS Gear, Window Texture (2009) http://www.fpsgear.ca/pl_images/window_texture_89.jpg (Accessed) 29/04/2010

[42] Felix Gers JOGL and OpenGL Teaching Site (2008) http://www.

felixgers.de/teaching/jogl/ (Accessed) 04/02/2010

[43] Dr.Hagit Hel-Or, Image Processing, University of Haifa, Stone Tex-ture(2009) http://cs.haifa.ac.il/hagit/courses/ip/Homework/

HW4files/stone_texture_for_tutorial.jpg (Accessed) 30/04/2010

[44] File format info, Wavefront .obj filetype specification (2010)http://www.fileformat.info/format/wavefrontobj/egff.htm (Ac-cessed) 27/04/2010

[45] Ross Ihaka, University of Auckland, Statistics 120 - Information Visualisa-tion, Chapter 4 - Human Vision (2003) http://www.stat.auckland.ac.

nz/~ihaka/120/Notes/ch04.pdf (Accessed) 27/04/2010

[46] John Page, Math Open References, Convex Polygon (2010) http://www.

mathopenref.com/polygonconvex.html (Accessed) 29/04/2010

88

[47] Toby Howard, Interactive Computer Graphics, Laboratory Exercise 3(2009).

[48] Pixel2Life studios Inc, Brick Wall Texture (2010) http://www.

pixel2life.com/twodded/staff/stu/Tutorials/BrickTexture/

bricks_zigzag_texture_6190218.JPG (Accessed) 16/02/2010

[49] Sara Bartynski et al, John Jay green roof project, Brick Texture (2007)http://community.seas.columbia.edu/cslp/resources/fall07/

JJGreenRoofBrick%20Wall%20texture.jpg (Accessed) 29/04/2010

[50] Unknown author, 3dstudio-max, brick wall texture (2010) http://

www.3dstudio-max.com/textures/images/brick-wall.jpg (Accessed)29/04/2010

[51] Caym, Deviantart, Seamless Grey Wall Texture http://fc01.

deviantart.net/fs48/f/2009/173/e/8/Seamless_wall_texture_

09_by_Caym.png (Accessed) 16/02/2010

[52] Developer’s Paradise, free wall texture, (2010) http://aceinfowayindia.com/blog/wp-content/uploads/2009/07/brick-texture-1.jpg (Ac-cessed) 30/04/2010

[53] Andrew S, Glassner (1995), Graphics Gems I, Academic Press Inc.

[54] Java-Tips (2005) http://www.java-tips.org/other-api-tips/jogl

(Accessed) 16/02/2010

[55] Adobe Systems Inc, Adobe Robohelp 8 (2010) http://www.adobe.com/

products/robohelp/ (Accessed) 30/04/2010

[56] Misha Griffiths, Speedy Sketch web help, University of Manchester (2010)http://www2.cs.man.ac.uk/~griffim7/WebHelp/index.htm (Accessed)01/05/2010

[57] Dem Pilafian, Center Key Software, Barebones Browser Launch (2008)http://www.centerkey.com/java/browser/ (Accessed) 16/02/2010

[58] Matku, artist-3d, Male character figure realistic man body (2001)http://artist-3d.com/free_3d_models/dnm/model_disp.php?uid=

1753&ad=best-design-award.php&count=count (Accessed) 02/05/2010

[59] Jakob Nielsen, How to Conduct a Heuristic Evaluation, Useit.com (2005)http://www.useit.com/papers/heuristic/heuristic_evaluation.

html (Accessed) 03/05/2010

[60] Misha Griffiths, Speedy Sketch questionnaire, (2010) http://www.

smart-survey.co.uk/v.asp?i=19980jdwzy (Accessed) 03/05/2010

[61] Misha Griffiths, Personal site, direct links to Speedy Sketch applicationand questionnaire (2010) http://www.mishagriffiths.com (Accessed)03/05/2010

[62] java-tips.org, code inspiration, (2005-2008) http://www.java-tips.org/

faqs/about-java-tips.org/what-is-java-tips.org.html (Accessed)24/02/2010

89

[63] Misha Griffiths, Speedy Sketch Blog, (2010) http://ssblog.

mishagriffiths.com (Accessed) 04/05/2010

[64] Misha Griffiths, Speedy Sketch Application (WebStart version), Hostedon Project Kenai http://kenai.com/downloads/speedysketch/launch.html (Accessed) 04/05/2010

90

APPENDIX A

PROJECT PLAN

A.1 Aims and Objectives

Program to be used by police and tactical forces Main objective of theprogram is to be used by the police in situations when a quick 3d modelof a building is required (a hostage situation for example).

Program must be intuitive and easy to use As the main aim of the pro-gram is to be used by the police force in time critical situations it musthave an intuitive interface.

Program must operate quickly As the situation in which the program willbe used may be time critical it must perform its task as quickly as possible.

Program must be accurate Accuracy of the representation constructed basedon the user input is critical as the final model could be used in life-threatening situations.

A.2 Proposed system features

A.2.1 Essential Features

Easy Drawing Tools User must be able to draw the building plan easily andquickly, lines should be straightened when drawn freehand (probably bya snap to grid system).

Quick and accurate 3d expansion System must be able to quickly and ac-curately represent the plan drawn out by the user in 3 dimensions.

Easy editing of currently existing plan The plan should be easily editableif the user has made a mistake.

A

A.2.2 Possible Extra Features

First person walk about Ability to go into the building and explore it infirst person view, allowing for a simulation run of an assault situation.

Build several floors using stairs Possible complication to the system wherestairs can be implemented to allow a floor to be built above the finishedplan for a lower floor.

A.3 Task, milestone and deliverable summary

Poster 11th November - submit poster

Seminar 18th November onwards - present seminar

Implementation Now onwards until 8th March - implement project and pre-pare testing, use iterative model for implementation, testing as implemen-tation progresses

Presentation 8th March onwards - present results of project.

Report 5th may - submit project report

B

Non-Project 47dReading Week 6dRevision For January Exams 24dEaster Holidays 17d

Poster 35dResearch 24d

Previous Project Research 8dCurrent Software Research 8dPossible Techniques Research 8d

Design 11dLayout 3dContent 8d

Submit PosterSeminar 17d

Content 8dPlan Seminar 3dCompile Notes and Prompts 5d

Slides 9dLayout 3dContent 6d

Present Seminar 18dImplementation 102d

Decide on Appropriate Language 3dDecide on Appropriate IDE 3dProgramming 80d

Implement GUI 40dImplement OpenGL 40d

Testing 16dImplement Tests 5dPerform Tests 1dTweak Program Based on Tests 10d

Presentation 12dReport 43d

Plan Report 7dOutline Key Points 1dProcess Body of Document 30dPrepare Imports for Document 2dFinalise Imports for Document 2dProof Read and Finalise Document 1d

Submit Report

2010, H1Oct 2009 Nov 2009 Dec 2009 Jan 2010 Feb 2010 Mar 2010 Apr 2010 May 2010 Jun 2…

Name Work

APPENDIX B

GLOSSARY

2D means two dimensional, two dimensions

3D means three dimensional, three dimensions

API is an acronym for Application Programming Interface and generally refersto an abstraction that describes either a software package or a set oflibraries for development use.

AutoCAD refers to Autodesk’s CAD software coupled with other 3D mod-elling and rendering software frequently included in the Autodesk package.

CAD is an acronym for Computer Aided Design and generally refers to itssoftware implementations.

Canvas usually refers to a GLCanvas object used to implement an OpenGLwindow.

Design pattern refers to a software engineering technique implemented in par-allel with the unified process to make the system more modular or morerelevant to the domain in which it exists.

Familiarity The degree to which a user recognizes user interface componentsand views their interaction as natural; the similarity of the interface toconcrete objects the user has interacted with in the past. User inter-faces can be familiar by mimicking the visual appearance of real-worldobjects, by relying on standardized commands, or by following other com-mon metaphors [38]

Field of view refers to an angle enclosing all objects visible by a camera (oran eye). Humans typically have a field of view approximately equal to180◦ but actually take in information from as wide an angle as 200◦[45].

FOV is an acronym for Field of View (see above).

GLU is an acronym for OpenGL Utility and refers to the OpenGL utility li-braries containing functions for interaction with the scene.

D

GUI is an acronym for Graphical User Interface and refers to the interfacethrough which the user interacts with the software in question.

HCI is an acronym for Human Computer Interaction and generally refers tomethods with which humans interact with computers and the ease of usewith which they are able to do so.

High cohesion refers to one of the GRASP design patterns in the unifiedprocess. High cohesion aims to make classes/objects as relevant as possibleto one object in the domain rather than describing several entities.

IDE is an acronym for Integrated Development Environment referring usuallyto an application that aids the development of software through varioushelpful short-cuts and integrations.

JOGL is an acronym for Java bindings for OpenGL referring to an implemen-tation of OpenGL in the Java programming language.

OpenGL is an acronym for Open Graphics Library and refers to a set of opensource libraries facilitating the creating, manipulation and interaction withtwo and three dimensional graphics.

Real time rendering refers to a three dimensional scene being rendered at>25 frames per second (the threshold at which the human eye perceivessmooth movement).

SketchUp refers to both @Last Software’s SketchUp and Google’s further de-veloped version.

Speedy Sketch refers to the application which is the subject of this report.

Splash screen refers to an image displayed before the application is loaded inorder to lessen the perceived loading time of the software package.

Tessellation refers to the subdivision of a polygon into polygons with fewersides (namely triangles).

Unified Process refers to Craig Larman’s approach to software engineeringdescribed in his book Applying UML and Patterns [2]

WIMP is an acronym for Windows, Icons, Menus and Pointers and generallyrefers to the most commonly used software interface style.

E

APPENDIX C

AUTOCAD AND SKETCHUP INTERVIEW

The following is a record of an email interview held with a fifth year architecturestudent at the University of Manchester. [25]

C.1 AutoCAD

1. What version of AutoCAD do you use? AutoCAD 2010.

2. How long have you been using AutoCAD About 4 years.

3. How long would you say it took you to become proficient with AutoCAD?About a year to get to a standard where I could produce professional draw-ings.

4. How proficient would you say you are with AutoCAD? I used Au-toCAD in my year in industry so I would say I am at a professionalstandard.

5. What is really useful/great about AutoCAD? It is the most compre-hensive software package in terms of creating 2D drawings (plans, eleva-tions etc.). Also once you are aware of the various functions available theyare fairly self explanatory to use.

6. What is really tedious/poor about AutoCAD? Without a professionaltutorial it is quite hard to become aware of the various functions that youcan carry out, however this is hard to criticise as it is probably inevitablewith it being so comprehensive. Also when you start using AutoCADin 3D it is extremely inefficient and needlessly complicated compared tousing it in 2D.

7. What do you wish you could change about AutoCAD? I would sim-plify the 3D elements of AutoCAD. Considering how simple and compre-hensive it is to use in 2D, it seems bizarre that most people then transfertheir 2D drawings into SketchUp to produce 3D architectural drawings. It

F

would be so much more efficient if you could produce 2D and 3D drawingsin the same package.

8. How long would take to develop a model of a 2 bedroom detached house in AutoCAD?Around 2/3 working days based on 9-5 hours.

9. And to render the model? 1-2 days depending on the detail required.

C.2 SketchUp

1. Have you ever used Google SketchUp? Yes.

2. What version of SketchUp do you use? Google SketchUp 7.

3. How long have you used SketchUp? 3 years.

4. How long would you say it took you to become proficient with SketchUp?About half a year.

5. How proficient would you say you are with SketchUp? Not as pro-ficient as I am in AutoCAD.

6. What is really useful/great about SketchUp? It is very easy and selfexplanatory to pick up. Also, you can transfer your 2D AutoCAD draw-ings into SketchUp and extrude into a 3D model (which is much quickerthan producing the same 3D model in AutoCAD).

7. What is really tedious/poor about SketchUp? Because the programfocuses on being simple to use, in terms of producing professional archi-tectural visualisations it is quite limiting; you require various additionalplug-ins and rendering programs to make a SketchUp drawing look pro-fessional.

8. What do you wish you could change about SketchUp? There are var-ious plug-ins that can render a SketchUp model to make it look more pro-fessional. It would seem far more simple if SketchUp had its own inbuiltrendering system that is as simple to use as its 2D modelling functions.

9. How long would it take to develop a model of a 2 bedroom detached house in SketchUp?If I am using SketchUp to produce a 3D model I always produce a 2D planin AutoCAD first and then extrude this up in SketchUp. Based on thataround 2 days (1 day for the 2D plan and 1 for the 3D model).

10. And to render the model? 1-2 days depending on the detail required(instant if SketchUp’s normal rendering style is acceptable).

G

APPENDIXD

CODE SAMPLES

GL gl; //instance variable

public void init(GLAutoDrawable gLDrawable) {

//we get the gl context and assign it to the instance variable

GL gl = gLDrawable.getGL();

...

}

public void display(GLAutoDrawable gLDrawable) {

//we draw a line along the x axis..

gl.glBegin(GL.GL_LINES);

gl.glVertex2d(0,0);

gl.glVertex2d(1,0);

gl.glEnd();

}

Code Sample 5: Sample JOGL code to draw a line of length 1 in the x axis

H

public void drawGrid()

{

gl.glEnable(GL.GL_LINE_STIPPLE);

gl.glColor3f(0.7f,0.7f,0.7f);

gl.glLineWidth(1.0f);

gl.glBegin(GL.GL_LINES);

for(int i=0;i<=curHeight;i+=40)

{

gl.glVertex2f(0,(float)i);

gl.glVertex2f(curWidth,(float)i);

}

gl.glEnd();

gl.glBegin(GL.GL_LINES);

for(int i=0;i<=curWidth;i+=40)

{

gl.glVertex2f((float)i,0);

gl.glVertex2f((float)i,curHeight);

}

gl.glEnd();

gl.glDisable(GL.GL_LINE_STIPPLE);

}

Code Sample 6: Code implementing the drawGrid() function to draw a simple, greygrid on the canvas

if (tool == STAIRS) {

gl.glPolygonMode(GL.GL_FRONT_AND_BACK, GL.GL_LINE);

gl.glBegin(GL.GL_QUADS);

//first we determine the orientation

if (Math.abs(mouse_y - y1) >= Math.abs(mouse_x - x1)) {

//then the relative orientation

if (mouse_x > x1) {

mouse_x = x1 + 20;

} else {

mouse_x = x1 - 20;

}

}//if y difference greater than x difference

else {

if (mouse_y > y1) {

mouse_y = y1 + 20;

} else {

mouse_y = y1 - 20;

}

}//else x difference is greater than y difference

Code Sample 7: Code implementation of stair orientation in the two dimensionalview

I

if (loopShape.getFloorNo() == floorNo) {

for (int j = 0; j < currentx.size(); j++) {

if (x1a == currentx.get(j)) {

if (y1a == currenty.get(j)) {

manipVn = j;

manipSHAPEn = i;

isVertexn = true;

//its over a vertex, so we mark the selected vertex

}//if current y location is the vertex

}//if current x location is the vertex

if (isVertexn) {

vertexOver = true;

break;

}//if its a vertex

else {

vertexOver = false;

}//else its not a vertex

}//for all vertices

}//if the shapes floor is this floor

Code Sample 8: Code sample demonstrating bounding squares for editing vertices.

J

APPENDIX E

UML DIAGRAMS

Figure E.1: Design class diagram of the 2D input part of the application

K

Figure E.2: Design class diagram of the 3D output part of the application

L

APPENDIX F

SAMPLE .SS SAVE FILE

This file demonstrates extracts from a genuine .ss save file created with SpeedySketch.

<?xml version="1.0" encoding="ISO-8859-1"?>

<Speedy_Sketch_Vertices>

<shape>

<type>FREEHAND</type>

<label>1</label>

<floor>0</floor>

<coords>

<x>5</x> <y>2</y>

<x>6</x> <y>2</y>

<x>7</x> <y>2</y>

<x>8</x> <y>2</y>

<x>9</x> <y>2</y>

<x>9</x> <y>3</y>

<x>9</x> <y>4</y>

<x>9</x> <y>5</y>

<x>8</x> <y>5</y>

<x>8</x> <y>4</y>

<x>7</x> <y>4</y>

<x>7</x> <y>3</y>

<x>6</x> <y>3</y>

<x>5</x> <y>3</y>

<x>5</x> <y>2</y>

<x>5</x> <y>2</y>

</coords>

</shape>

<shape>

<type>RECTANGLE</type>

<label>1</label>

<floor>0</floor>

<coords>

M

<x>8</x> <y>6</y>

<x>8</x> <y>9</y>

<x>10</x> <y>8</y>

<x>10</x> <y>6</y>

<x>8</x> <y>6</y>

</coords>

</shape>

<shape>

<type>CIRCLE</type>

<label>1</label>

<floor>1</floor>

<coords>

<x>178</x> <y>260</y>

<x>269</x> <y>304</y>

</coords>

</shape>

<stair>

<sTLX>840</sTLX>

<sTLY>163</sTLY>

<sBRX>800</sBRX>

<sBRY>143</sBRY>

<sOR>1</sOR>

<sFL>0</sFL>

</stair>

<door>

<dX>360</dX>

<dY>176</dY>

<dOR>1</dOR>

<dFL>0</dFL>

</door>

<window>

<wX>546</wX>

<wY>200</wY>

<wOR>0</wOR>

<wFL>0</wFL>

</window>

<annotation>

<aFL>0</aFL>

<aR>255</aR>

<aG>51</aG>

<aB>51</aB>

<aX>449</aX> <aY>312</aY>

<aX>460</aX> <aY>312</aY>

<aX>469</aX> <aY>310</aY>

<aX>488</aX> <aY>308</aY>

<aX>499</aX> <aY>304</aY>

<aX>512</aX> <aY>297</aY>

<aX>523</aX> <aY>293</aY>

<aX>535</aX> <aY>286</aY>

<aX>545</aX> <aY>276</aY>

N

<aX>557</aX> <aY>267</aY>

<aX>564</aX> <aY>261</aY>

<aX>568</aX> <aY>255</aY>

<aX>577</aX> <aY>245</aY>

<aX>581</aX> <aY>240</aY>

<aX>583</aX> <aY>237</aY>

<aX>589</aX> <aY>228</aY>

<aX>592</aX> <aY>225</aY>

<aX>593</aX> <aY>225</aY>

<aX>593</aX> <aY>223</aY>

<aX>594</aX> <aY>220</aY>

<aX>595</aX> <aY>216</aY>

<aX>595</aX> <aY>214</aY>

<aX>595</aX> <aY>214</aY>

</annotation>

<camera>

<camX>673</camX>

<camY>166</camY>

<camLAX>358</camLAX>

<camLAY>125</camLAY>

<camFOV>45</camFOV>

<camFL>1</camFL>

<camED>true</camED>

<camORSET>true</camORSET>

</camera>

</Speedy_Sketch_Vertices>

O

APPENDIX G

SAMPLE .OBJ FILE

The following sample contains extracts from a file describing a three dimensionalmodel of a man with arms stretched out to his sides.

v 0.613210 12.071347 1.489616

v 0.605583 12.084587 1.491416

v 0.593672 12.095121 1.492851

v 0.578623 12.101904 1.493776

v 0.561912 12.104246 1.494095

v 0.545200 12.101905 1.493776

v 0.530152 12.095121 1.492851

v 0.518241 12.084587 1.491416

v 0.510613 12.071347 1.489616

v 0.507988 12.056695 1.487626

The above depict vertices of the model

vt 1.917356 0.429493

vt 1.925190 0.429493

vt 1.933024 0.429493

vt 1.940858 0.429493

vt 1.948692 0.429493

vt 1.956526 0.429493

vt 1.964360 0.429493

vt 1.972194 0.429493

vt 1.980028 0.429493

vt 1.987862 0.429493

The above depict texture coordinates of the model

vn 0.227678 0.212803 -0.950199

vn 0.154893 0.188527 -0.969776

vn 0.144745 0.214630 -0.965910

vn 0.212879 0.251145 -0.944250

vn 0.193122 0.286419 -0.938439

P

vn 0.131770 0.238864 -0.962071

vn 0.114869 0.260222 -0.958692

vn 0.168468 0.317675 -0.933114

vn 0.139965 0.344365 -0.928344

vn 0.095810 0.278844 -0.955545

The above depict coordinates of the model normals

f 5789/6594/1 1/1/2 5786/6590/3 5785/6589/4

f 5787/6591/5 2/2/6 5791/6596/7 5790/6595/8

f 5792/6597/9 3/3/10 5795/6600/11 5794/6599/12

f 5796/6601/13 4/4/14 5799/6604/15 5798/6603/16

f 5800/6605/17 5/5/18 5803/6608/19 5802/6607/20

f 5804/6609/21 6/6/22 5807/6612/23 5806/6611/24

f 5808/6613/25 7/7/26 5811/6616/27 5810/6615/28

f 5812/6617/29 8/8/30 5815/6620/31 5814/6619/32

f 5816/6621/33 9/9/34 5819/6624/35 5818/6623/36

f 5820/6625/37 10/10/38 5823/6628/39 5822/6627/40

The above depict the vertices number, texture coordinate number and normalnumber of each face of the model (in this case the faces are quadrilaterals).

Q

APPENDIXH

TEXTURES USED

H.1 Wall and Stair Textures

(a) Brick Texture [48] (b) Light Brick Texture [49]

Figure H.1: Regular and light brick textures

R

(a) Dirty Brick Texture [50] (b) Eroded Brick Texture [52]

Figure H.2: Dirty and eroded brick textures

(a) Grey Wall Texture [51] (b) Stone Stair Texture [43]

Figure H.3: Grey wall and stair textures

S

H.2 Doors and Windows

(a) Window Texture [41] (b) Door Texture [40]

Figure H.4: Window and door textures

T

H.3 Skybox textures

(a) North face (b) West face

(c) South face (d) East face

(e) Top face (f) Bottom face

Figure H.5: The six faces of the skybox. All from the jMonkey Engine libraries [31]

U

APPENDIX I

LIST OF HEURISTIC EVALUATION CATEGORIES

The following is a list of Nielsen’s ten heuristic evaluation categories [59] alongwith the author’s interpretation of each one.

Visibility of system status The state of the system should be clearly visibleto the user. Any modes that the system can be in should be clearly stated.

Match between system and the real world The system should avoid us-ing terms related to the system and should instead use the user’s languagebase.

User control and freedom Actions the user inputs into the system shouldbe reversible (undo/redo). Any accidental functions selected by the usershould be easy to exit.

Consistency and standards All words and labels that do the same thingshould be labelled in the same way.

Error prevention If an error can be prevented then it should be rather thansimply outputting an error message.

Recognition rather than recall Make actions and options highly visible sothat the user has fewer things to remember.

Flexibility and efficiency of use Include shortcuts for advanced users to speedup repetitive tasks.

Aesthetic and minimalist design Any irrelevant information should be hid-den as it detracts from any relevant information.

Help users recognize, diagnose, and recover from errors Error messagesshould describe the error in plain language and offer a suggestion of howto avoid the error in the future (if possible).

Help and documentation A highly functional and searchable help systemshould be included.

V

APPENDIX J

HEURISTIC EVALUATION

Visibility of the system status

Many optimisations have been implemented to improve the visibility of thesystem status. Most often this is done in the form of a label. The current floorand tool are both displayed as labels on the toolbar along with the current totalnumber of shapes and floors. This does not mean, however, that there are noproblems in this category:

Problem Found Frequency Impact Persistence Severity Reason for problemShape toolbox toolnot highlightedwhen in use

3 2 3 2 The shape toolbox shouldalways be accessible andtherefore cannot be dis-abled in the same way asother tools.

Minimal indicationwhen a floor ismissing

2 2 1 2 Colour coded floorscaused problems whentrying to view the currentfloor and the toggle but-ton to view other floorsdoes not quite suffice.

Match between system and the real world

Great effort has been made to naturalise the language used in Speedy Sketchwith standardised menu titles and tool-tips on menu items relating to real worldconcepts. For example the drawing area is always referred to as the canvas andeach tool has as simple a name as possible.

W

User control and freedom

Perhaps the most important feature to take notice of in this category is theundo/redo tool. The inclusion of such a tool makes any action (other thanexiting the program) completely reversible. The inclusion of the redo tool evenmakes any previously undone actions reversible. A save/load feature is alsoincluded for more long term reversibility.

Problem Found Frequency Impact Persistence Severity Reason for problemImpossible to es-cape shape toolboxwithout selecting atool

3 1 2 1 The user has to selecta tool before exiting thismenu, essentially selectingthe already selected toolfunctions as a cancel but-ton.

No inclusion of abutton to exit 3dview

4 1 2 2 The 3d view may be ex-ited by using Esc or click-ing the cross at the topright, a cancel button wasnot included to keep thecanvas as minimalistic aspossible.

Consistency and standards

As real world concepts are adhered to firmly, consistency is somewhat implicit.Conventions are established and are constant throughout the system and thehelp documentation.

Problem Found Frequency Impact Persistence Severity Reason for problemPossible confusionbetween repeatfloor tool and multifloor tool

1 3 2 2 Similar naming conven-tion is used for similar(but not identical) fea-tures.

Error prevention

Many potential errors are accounted for and circumvented. Some are simplyunavoidable (e.g. the user attempting to load a non-Speedy Sketch file type).In such cases the system includes a helpful error message describing the problemand how to avoid it in the future (only opening .ss files). Many non-catastrophicbugs remain however.

Problem Found Frequency Impact Persistence Severity Reason for problem

X

Doors and windowsdo not auto-snap towalls

3 3 3 3 No collision detection isimplemented thereforeSpeedy Sketch has noknowledge of walls assuch.

Curved surfacescannot handledoors and windows

2 3 3 3 Again this is due to a lackof collision detection; ifthe system has no knowl-edge of walls then it has noknowledge that they arecurved.

Inconsistent light-ing

2 1 2 1 This is due to the gen-eration of vector normalson walls and their depen-dence on the winding ofthe shape (clockwise re-sults in the opposite ofanti-clockwise in terms ofvector direction).

Recognition rather than recall

This category was, in fact, somewhat accounted for when considering that manyusers may be using a graphics tablet. Users using a graphics tablet would findit a nuisance to constantly traverse regular menu systems. As such, the toolbaron the left side of the screen containing all the important tools is included. Theicons [8] are large and are highly representative of the tool they invoke.

If the user really does have trouble recognising any of the features the helpdocumentation is readily available either through the help menu or by pressingF1.

Flexibility and efficiency of use

Several accelerators and short-cuts are available to expert users of the system.The most important are the multi floor tool (holding a number key and inputtinga shape) and the repeat floor tool (repeating all the contents of the current flooron the floor above). All file menu items also have keyboard short-cuts for easeof access if the user is a using a graphics tablet for example.

Problem Found Frequency Impact Persistence Severity Reason for problemMovement prob-lems on somelaptops

1 4 2 1 This is due to some lap-tops not accepting key-board and mouse input si-multaneously, other move-ment options are avail-able.

Y

Multi-floor limitedto 9 floors

2 0 1 0 There are only nine rele-vant number keys. Theuser can hold Ctrl anddraw if more floors are re-quired.

Aesthetic and minimalist design

Much effort has gone into the aesthetics of the design and the removal of anyirrelevant information from dialogues. All dialogue windows are made as learn-able as possible (e.g. colour window means select a colour) and instructionsare included in windows with multiple options. Any further confusion is easilyresolved by consulting the help system.

Help users recognize, diagnose, and recover from errors

Errors are rare in Speedy Sketch but when users encounter them it is importantto help them recover. Several tools have already been discussed relating to thereversibility of human errors but perhaps even more important is the ability torecover from system errors.

Questions 9, 10 and 11 on the questionnaire (Appendix K) refer to thefrequency of errors occurring whilst the user is performing tasks. Question11 demonstrates that only one of the users encountered an error that was notaccounted for by an error message (this problem is now fixed) and only two ofthe thirteen test subjects even encountered an error message. Of those two thatencountered an error message, however, one found that it was unhelpful whilstthe other stated that it explained the error well. A catastrophic error currentlyexists that prevents the program from being ready for release:

Problem Found Frequency Impact Persistence Severity Reason for problemFiles with no exten-sion throw excep-tions

2 4 4 4 The file-type parser im-plemented to recognise .ssfile-types throws a nullpointer exception whenfiles have no extension(this is catastrophic onsystems where files do notgenerally have extensionssuch as Linux).

Help and documentation

A fully functional help system is included in both .chm and online formatsallowing the user to search and locate step by step instructions on how to useany of the tools included in Speedy Sketch.

Z

Problem Found Frequency Impact Persistence Severity Reason for problemInconsistent helpfiles between oper-ating systems

2 0 0 0 As only Windows systemsare implicitly compatiblewith .chm help files an al-ternate online version isavailable for users of otheroperating systems. Thetwo systems are identicalin every way other thaninterface.

APPENDIXK

QUESTIONNAIRE

The following is the questionnaire given to evaluators of Speedy Sketch. Answersare included in chart form for multiple choice questions and sentences whenverbose answers were given.

Results Summary

General

1. To which of the following age groups do you belong?

Response Percent

Response Total

1 <18 0% 0

2 18-21

38.5% 5

3 21-25

61.5% 8

4 25-30 0% 0

5 30+ 0% 0

Statistics based on 13 respondent(s). 0 skipped.

2. Which operating system did you test Speedy Sketch on?

Response Percent

Response Total

1 Windows XP or older

30.8% 4

2 Windows Vista

23.1% 3

3 Windows 7

38.5% 5

4 Mac OSX

7.7% 1

5 Older Mac OS 0% 0

6 Fedora Linux 0% 0

7 Ubuntu Linux 0% 0

8 Other Linux Distribution 0% 0

9 Solaris 0% 0

10 Other 0% 0

Statistics based on 13 respondent(s). 0 skipped.

3. Do you have any previous experience of 2D/3D modelling software?

Response Percent

Response Total

1 No (Please skip thenext question)

61.5% 8

2 Yes (Please answerthe next question)

38.5% 5

Statistics based on 13 respondent(s). 0 skipped.

4. Please describe the experience you have had with 2D/3D

(6 total)

modelling software :

1 (1203745)

I've used a lot of 2D and 3D modelling software, ranging from all of the Adobe products, paintshop pro, painter etc. to 3D software such as Maya, Cinema 4D, Electric Image and Silo. All of which I've used since I was about 10 for 2D software, and 13 for 3D software.

2 (1207968)

3Ds Max, Maya, Google SketchUp

3 (1285905)

None

4 (1289959)

Some experience of sketchup, extensive experience of photoshop as well as adobe video packages

5 (1296969)

Advanced Computer Graphics courses at University level.

6 (1306950)

NoLimits - roller coaster design software with 3d objects as well AC3D Google Sketchup Project Dragonfly

5. How long did you spend using Speedy Sketch?

Response Percent

Response Total

1 <5 minutes

15.4% 2

2 5-15 minutes

61.5% 8

3 15-30 minutes

15.4% 2

4 30-60 minutes 0% 0

5 >60 minutes

7.7% 1

Statistics based on 13 respondent(s). 0 skipped.

6. How long did it take you to learn how to use it to create a simple building and view it?

Response Percent

Response Total

1 <1 minute

38.5% 5

2 1-5 minutes

46.2% 6

3 5-10 minutes

7.7% 1

4 10-20 minutes 0% 0

5 >20 minutes

7.7% 1

Statistics based on 13 respondent(s). 0 skipped.

7. Which of the following tools did you make use of?

Response Percent

Response Total

Freehand Draw Tool

92.3% 12

Rectangle/Square Tool

76.9% 10

Ellipse/Circle Tool

69.2% 9

Window Tool

69.2% 9

Door Tool

61.5% 8

Stair Tool

76.9% 10

Import Object Tool

23.1% 3

Edit Vertices Tool

53.8% 7

Camera PlacementTool

69.2% 9

Annotation Tool

46.2% 6

Repeat Floor Tool(Menu)

30.8% 4

Multi Floor Tool(Holding a number

down and drawing ashape)

38.5% 5

Multi Floor Tool

(Holding CTRL anddrawing a shape)

30.8% 4

Statistics based on 13 respondent(s) 0 skipped.

Errors

8. Did you worry that many of the things you did with the program may have been wrong?

Response Percent

Response Total

1 Constantly 0% 0

2 I did at first but then Igot used to it

37.5% 3

3 A few times

37.5% 3

4 Hardly at all

12.5% 1

5 Not at all, I knew whatI was doing

12.5% 1

Statistics based on 8 respondent(s). 5 skipped.

9. Did you encounter any error messages while using the program? If so, how many?

Response Percent

Response Total

1 0

84.6% 11

2 1

15.4% 2

3 2 0% 0

4 3 0% 0

5 4 0% 0

6 5 or more 0% 0

Statistics based on 13 respondent(s). 0 skipped.

10. If you encountered any error messages, would you say they explained the problem you encountered effectively?

Response Percent

Response Total

1 I did not encounterany messages

83.3% 10

2 Some were describedeffectively, some were

confusing 0% 0

3 Yes

8.3% 1

4 No

8.3% 1

Statistics based on 12 respondent(s). 1 skipped.

11. Did you encounter any problems that crashed the program that were not accounted for by an error message?

Response Percent

Response Total

1 Yes

7.7% 1

2 No

92.3% 12

Statistics based on 13 respondent(s). 0 skipped.

12. If so please describe them: (1 total)

1 (1207968)

wanted to use 3d view then stopped workin (im using Uni computers)

13. Did you encounter any bugs in the program that you felt should not be there?

Response Percent

Response Total

1 Yes

38.5% 5

2 No

61.5% 8

Statistics based on 13 respondent(s). 0 skipped.

14. If so please describe them: (5 total)

1 (1203745)

I tried to open a folder while navigating for an .obj file and waited about 5 mins. The folder never opened, and I coudln\t navigate away. Click cancel worked but I had to move the file in order to open it. Once the file was imported, I tried to view it in 3D mode but 3D mode never opened. Windows and doors can be created where there is no wall. Windows and doors can't be created diagonally. Creating walls creates a vertex on every step of the grid rather than recognising that the wall is straight and creating just one polygon between. Elipse doesn't snap to grid. A few times when I tried to move forward it moved in an odd direction. Lighting was very inconsistent. Ctrl is used as the primary key, where on a mac cmd should be used.

When I opened the "draw shape" palette, I could still click on the freehand tool, but I couldn't use it until I selected one of the options from the draw shape palette. Clicking the close cross didn't close it.

2 (1203916)

When switching to 3D the window appeared but nothing was drawn in it. Waited 5 minutes with no activity.

3 (1207968)

ive just done it

4 (1277483)

I could draw floating structures.

5 (1305044)

Texture was not applied to every polygon, most were just black walls

Ease of use

15. How easy was Speedy Sketch to learn?

Response Percent

Response Total

1 Not at all easy 0% 0

2 Not very easy 0% 0

3 It was ok

7.7% 1

4 Quite easy

53.8% 7

5 Very easy

38.5% 5

Statistics based on 13 respondent(s). 0 skipped.

16. Did you at any point consult the help?

Response Percent

Response Total

1

The help file wouldn'tload and I didn't

bother looking at theonline help instead

0% 0

2 Yes

38.5% 5

3 No

61.5% 8

Statistics based on 13 respondent(s). 0 skipped.

17. If you did consult the help, how useful did you find it?

Response Percent

Response Total

1 Very useful

50% 2

2 Somewhat useful

50% 2

3 A little useful 0% 0

4 Hardly at all useful 0% 0

5 Not useful at all 0% 0

Statistics based on 4 respondent(s). 9 skipped.

18. How much time do you think it would take you, using Speedy Sketch to model (in one scene) 7 building of different heights with windows on all floors, doors on the lowest floors, 3 (single storey) staircases, view it from a specific camera angle and print the three dimensional view?

Response Percent

Response Total

1 I wouldn't know how todo 1 or more of those

things

7.7% 1

2 >20 minutes

30.8% 4

3 10-20 minutes

30.8% 4

4 5-10 minutes

15.4% 2

5 0-5 minutes

15.4% 2

Statistics based on 13 respondent(s). 0 skipped.

19. Did all the menu items you clicked on perform the expected tasks?

Response Percent

Response Total

1 Yes they all did (skipthe next question)

84.6% 11

2 Most did

15.4% 2

3 Few did 0% 0

4 None did 0% 0

Statistics based on 13 respondent(s). 0 skipped.

20. Please describe what you expected for the ones that did not and what happened instead: (2 total)

1 (1207968)

3d view

2 (1289959)

i expected square to draw a square not open a new menu...

21. Did you encounter any features that you thought were barely/not at all useful?

Response Percent

Response Total

1 Yes, several

15.4% 2

2 Yes, one

15.4% 2

3

No, I thought everything I used was

useful (skip the nextquestion)

69.2% 9

Statistics based on 13 respondent(s). 0 skipped.

22. If so, please describe them: (3 total)

1 (1203785)

I didn't understand fully to begin with what I was meant to be doing so at first it was daunting as the features were not explained.

2 (1203745)

The lines didn't draw in different colours on different floors. Why is it still in the legend? :P I would have been useful :)

3 (1289959)

the control-draw, holding a number and drawing is sufficient..

23. Would you say the program was quick when transferring from the two dimensional view to the three dimensional view and back?

Response Percent

Response Total

1 Yes, very much so

53.8% 7

2 Slightly so

15.4% 2

3 Somewhat

7.7% 1

4 Hardly at all

7.7% 1

5 Not at all

15.4% 2

Statistics based on 13 respondent(s). 0 skipped.

24. Would you say that modelling buildings and viewing them in 3d was a quick process with Speedy Sketch?

Response Percent

Response Total

1 Very much so

61.5% 8

2 Slightly so

23.1% 3

3 Somewhat

15.4% 2

4 Hardly at all 0% 0

5 Not at all 0% 0

Statistics based on 13 respondent(s). 0 skipped.

Satisfaction

25. Did you at any point find the program frustrating to use?

Response Percent

Response Total

1 Not at all

30.8% 4

2 Hardly at all

46.2% 6

3 A little

7.7% 1

4 Moderately

15.4% 2

5 Very much so 0% 0

Statistics based on 13 respondent(s). 0 skipped.

26. Did you find using the program a fun activity?

Response Percent

Response Total

1 Not at all

7.7% 1

2 Hardly at all

7.7% 1

3 Somewhat

7.7% 1

4 Slightly

46.2% 6

5 Very much so

30.8% 4

Statistics based on 13 respondent(s). 0 skipped.

27. Were the 3D results from your 2D input what you expected?

Response Percent

Response Total

1 Not at all

15.4% 2

2 Hardly at all 0% 0

3 Somewhat 0% 0

4 Slighty so

30.8% 4

5 Very much so

53.8% 7

Statistics based on 13 respondent(s). 0 skipped.

28. If not, how did they differ from what you expected?: (4 total)

1 (1203916)

Didn't appear.

2 (1207968)

i didnt get them:(

3 (1285905)

I found scrolling around the buildings difficult as first, i didn't check help to see if there was advice on panning around the 3D view but if there isn't then this would be useful.

4 (1305044)

Some polygons left untextured as mentioned before

29. If given the opportunity what would you change about Speedy Sketch?: (6 total)

1 (1203785)

Explain the features

2 (1203745)

Make doors auto-align to walls. Multi-floors should all get edited together unless somehow unlocked. Doors ad windows should open or become transparent on approach. Have a walkthrough mode emulating being a person, rather than a floating ghost. Allow adding and deleting of vertices. I would move the import tool to a different spot. I would make imported objects viualisable in 3D space... Somehow. I would add a button in 3D mode to exit to 2D mode.

3 (1207968)

opportunity for more precise modelling (more complex shapes) i didnt seem to be able to put window on circle shaped walls id like more view windows not just one when i change floors id like some outlines for the walls in the other flooes

4 (1277483)

-Maybe have shapes able to combine to form a building, eg. circle attached to rectangle - Allow the option of not having to readjust vertices to snap to an edge

5 (1305044)

Perhaps a quick help box when clicking on a previously unused tool just detailing the instructions of use.

6 (1306950)

-Allow the user to use his/her own images as texture -Make the shape button more intuitive -Resizing windows and doors -Auto align windows, stair cases and doors -Auto draw buildings form floor plan or use the floor plan as a background to trace the building -No objects "floating" by themselves should be allowed, so improve the logic behind placing objects depending on what they are -Show user a message if one of the floors is empty between two other floors to check if that is what they wanted -Implement "see through" walls -Select and delete any part of a wall -allow the windows to be stretched on to curved surfaces or corners -click and choose textures for any segment of a wall/floor/ceiling so that the end result could be closer to real life building -variable staircase height

30. What features of Speedy Sketch did you particularly enjoy?: (6 total)

1 (1203745)

It was fast to make odd shaped cubes?

2 (1207968)

its in Java

3 (1277483)

the free hand tool in 3D was fun to use.

4 (1293761)

Having stairs outside.

5 (1305044)

Ease of use, very professional look and feel to the program.

6 (1306950)

Multi floor tool as it made building a city very quick

31. Are there any comments you would like to include as part of this questionnaire?: (2 total)

1 (1207968)

nope

2 (1305044)

None!