1. Dynamic Web Sites Chris North cs3724: HCI

2. Presentations matt ketner, sam altman, mike gordon Vote: UI Hall of Fame/Shame?

3. Next Apr 4: Proj 2, final implementation Presentations: UI critique or HW2 results Next Tues: karen molye, steve kovalak Next Thurs: demos?

4. Review What are independent variables? The stuff that you vary: UI What are dependent variables? The stuff that you measure: user perf time How do you analyze the results? Stats: t-test, anova 95%, 99% < nothing: redesign

5. GUIs vs WUIs Standard GUIs E.g. Visual Basic, Java Single user, location Portability is less critical Power dynamics Targeted audience Webpage UIs broad user class Supports low power clients Avoids installation, updates, backups Enables One time users, quick, simple Lightweight Collect info from users, permission unneseary

6. WUIs Client (Browser) Server (Web server) URL request html page Server side scripting Dynamically generated pages Client side scripting Interactive pages why? faster feedback Saves server animation why? customized pages for users Security Business logic Data-driven, data intensive collaborative

7. WUI Technologies Client side: Javascript VBscript (MS) DHTML Html, forms, components (java applets, activeX) Server side: CGI: perl, shell scripts … ASP (MS) Cold fusion Jsp, Php Servlets: java, activeX

8. Client side Javascript: click here http://yugop.com/ver3/stuff/03/fla.html

9. Document Object Model <input type=“button” name=“mybutton” value=“OK” onclick=“document.myform.mybutton.color=red”> document myform mybutton … …

10. Server Side http://www.myserver.com/myscript.exe Prints an html file (+header) to stdout: print “Content-type: text/html \n” print “\n” print “ ” print “The time is “, time( ) print “ ” Client browser receives: The time is 2:00pm, March 28, 2002

11. Processing Forms GET, querystring http://myserver.com/myscript.exe?widget=value&… Myscript.exe reads data from URL string POST Myscript.exe reads data from stdin

12. Example Books.exeCart.exePurchase.exe Shows books list Add to cart View cart button Displays cart contents Delete items Purchase button Charges credit card Displays ‘thankyou’ Link back to books Amazon.com server

13. Problems Many simultaneous users No state data maintained Client not in sync with server (e.g. back button) Books.exeCart.exePurchase.exe …

14. Different than GUI programming! One user (per executable) ‘Global’ state data Client = server Shopping.exe Books window Cart window Purchase window

15. Problems Myscript.exe starts from scratch each time Each page request is completely independent No state data maintained between requests »Who is the user? »What is his data? »Where is he in the ‘application’? How to maintain state info across page accesses? Pile all state data into hidden form items Cookies Store state data in a database, index by unique user id

16. ASP Provides ‘session’ awareness Maintains state info for each user Scripts access global storage Visual Basic language Mix code and html output

17. html + Code New tags and Myscript.asp: The time is Good morning Good afternoon Client receives: The time is 2:00pm Good afternoon

18. Session Data Global object: session Hello, Client receives: Hello, Chris

19. Processing form input Global object: request.form Thanks for giving us your name,