obs - final presentation
TRANSCRIPT
![Page 1: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/1.jpg)
Kurt LarsonJordan HofkerMichael GuthmannDavid Kim
![Page 2: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/2.jpg)
Problem High-level solution Representative tasks Design evolution Description of UI and demo Final usability test Reflection on project
![Page 3: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/3.jpg)
Problem: No tool for remote battlemat game play
Distance is an issue Cost of tokens, battlemat, etc. could be
prohibitive
![Page 4: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/4.jpg)
Create web based battlemat system Replicate tabletop game System has battlemat backdrop
Place tokens on map
Move tokens
Draw on the map
Drag the map
Determine spell area
![Page 5: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/5.jpg)
![Page 6: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/6.jpg)
Join a game Upload a token Place a token Move a token Draw on battlemat Select a spell template Erase battlemat
![Page 7: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/7.jpg)
Exercised almost all the system functionality Most common tasks for a player or dungeon
master Most dependent on the clarity of the icons
and tool tips
Icon clarity and tool tips were the riskiest parts of the system
![Page 8: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/8.jpg)
Alternative designs
Login first or battlemat first?
Battlemat that is full screen or within a frame?
Inclusion of cursor icons?
![Page 9: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/9.jpg)
Paper prototype
Icons were not clear
![Page 10: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/10.jpg)
First prototype
Added tool tips
Revised the icons
![Page 11: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/11.jpg)
Final prototype
Added more functionality
Re-revised the icons and tool tips
![Page 12: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/12.jpg)
Built using Silverlight 2.0 Beta
C#
XAML
Gave the rich experience of a desktop application in a web app
Very full implementation
Out of scope: saving uploaded images, hosting shared sessions
![Page 13: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/13.jpg)
Key problems
Erase functionality was unclear
▪ Reworked erase functionality
Image upload had no feedback
▪ Added immediate feedback
New Insight
Affirmed our tool tips and icons
Affirmed the zoom and center functionality
Affirmed cursor icons
![Page 14: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/14.jpg)
Most important was immediate feedback Specific feedback
▪ Tool tips
▪ Clear button icons
▪ Changing the cursor icons
▪ Image upload
Maintaining conventions Grab and drag
Drag and drop
Drawing tools, etc.
![Page 15: OBS - Final Presentation](https://reader034.vdocuments.us/reader034/viewer/2022042716/55b5c755bb61eb2b208b459b/html5/thumbnails/15.jpg)