1 / 31

Human Computer Interaction Introduction to Part II - Implementing Technologies -

Human Computer Interaction Introduction to Part II - Implementing Technologies -. SOFTENG 350 - Lecture 15 SWING / Java Server Pages Web Engineering / Rigorous Interface Specification. Today’s Outline. SOFTENG 350 Organizational Stuff

xanthus-clemons
Download Presentation

Human Computer Interaction Introduction to Part II - Implementing Technologies -

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Human Computer InteractionIntroduction to Part II- Implementing Technologies - SOFTENG 350 - Lecture 15 SWING / Java Server Pages Web Engineering / Rigorous Interface Specification

  2. Today’s Outline • SOFTENG 350 Organizational Stuff • Introduction to User Interface Technologies and System Architecture • Outline of the Assignment • Jump Start to Swing – Tomorrows Lab

  3. SOFTENG 350 Organizational Stuff • SOFTENG 350 Organizational Stuff • Introduction to User Interface Technologies and System Architecture • Outline of the Assignment • Jump Start to Swing – Tomorrows Lab

  4. People • Lecturers • Prof. John Grundy (coordinator) • Room 303. • Email john-g@cs.auckland.ac.nz • Dr Dirk Draheim (May/June 2006 in Auckland) • Room 489 (CS Building) • Email draheim@acm.org • www.draheim.formcharts.org • Phone (office) 373-7599 x 88914 • NZ vodafone 02102777154 • Tutors • Richard Li Lei • Room 476 (CS Building) • Email l.li@cs.auckland.ac.nz • Christof Lutteroth • Room 476 (CS Building) • Email lutteroth@cs.auckland.ac.nz • www.cs.auckland.ac.nz/~lutteroth/

  5. Objectives and Learning Outcomes of 350 • Objectives: • Cover basic theory and practice of HCI • Introduction to HCI concepts, theories, techniques • Introduction to Swing and JSP-based development • Introduction to Web Engineering • Try out material on practical projects • Learning outcomes: • Appreciation of some of the key issues in human-computer interaction • On a software project will be able to identify users’ characteristics and needs; be able to design an effective and efficient UI to meet these needs • Have gained some basic development skills with common UI technologies (Swing, JSPs) • Have gained some insight in rigorous UI specification

  6. Lecture/Lab/Tutorial Times

  7. Assessment

  8. Lab/Tutorial Glue Assignment preparing practicing Lab Tutorial Lecture Test Exam exercising

  9. Plan 2nd May 1 – June 2

  10. Resources

  11. Resources • Walrath, K., Campione, M., Huml, A., Zakhour, S., The JFC Swing Tutorial, Addison-Wesley Professional, 2004, available online https://www.se.auckland.ac.nz/courses/SOFTENG350/resources/ • Ball, J., Carson, D. B.,  Evans, I., Haase, K., Jendrock, E., The Java EE 5 Tutorial, Sun Microsystems, 2006, available online https://www.se.auckland.ac.nz/courses/SOFTENG350/resources/ • Draheim, D., Weber, G., Form-Oriented Analysis, Springer, 2005, material online www.formcharts.org • Dix, Finlay, Abowd & Beale, Human Computer Interaction (3rd Edition), Pearson Education 2004 • Class web Site https://www.se.auckland.ac.nz/courses/SOFTENG350/

  12. The JFC Swing Tutorial • Getting Started with Swing • Learning Swing by Example • Using Swing Components • Laying Out Components within a Container • Writing Event Listeners • Performing Custom Painting

  13. Introduction toUser Interface Technologies&System Architecture • SOFTENG 350 Organizational Stuff • Introduction to User Interface Technologies and System Architecture • Outline of the Assignment • Jump Start to Swing – Tomorrows Lab

  14. Graphical User Interfaces Graphic Editor Pacman Internet Phone Text Editor

  15. Form-Based User Interface Welcome Page Logout My Shopping Cart Book QuantityPrice Quine: Word and Object 112.46 Wittgenstein: Tractatus 123.06 Varela: The Embodied Mind 244.68 Adams: Watership Down 762.30 Delete Delete Delete Delete Update Buy items in cart Search for a book: Search

  16. Ultra-Thin Clients HTTP CGI Web Presentation Layer GET hypertext/dir/index.html HTTP/1.0 Browser ....<head> <title> Dummy </title></head>.... PC-Memory Application Server Database PC 3270 Data Stream AID Cursor Address Data..... Application Program 3270 Terminal Command Cursor Address Data..... TP-Monitor Device Buffer Disk Disk Mainframe

  17. SAP System Thin Client screen program ABAP/4 GUI PBO input template PAI PBO input template PAI ABAP/4 Interpreter PBO input template PAI module pool TRPC Application Server process before output Database transactional remote procedure call process after input

  18. Example Fat Client IMIS System

  19. IMIS System Architecture • Integrated Measurement and Information System measurement stations PARK system FTP server client tier server application logic document management system job batch processing PARK controller application server cluster database cluster

  20. User Interface Agents

  21. User Interface Builders • Tutorial Friday, 12th May, by Christof • GUI Builder MS Visual Studio • Building Static Web Pages with MS Publisher 2003

  22. Outline of the Assignment • SOFTENG 350 Organizational Stuff • Introduction to User Interface Technologies and System Architecture • Outline of the Assignment • Jump Start to Swing – Tomorrows Lab

  23. Google Kids • Example Screen by Ranny

  24. Assignment II Google Kids ImplementationClick-Dummy Searching  Access Log Servlets JSP Browsing Kid Managing Category Hierarchy and/or Content Categories Content  Swing GUI Viewing Access Log Administrator

  25. Assignment II Google Kids ImplementationHypotheticalFull-Fledged Implementation Google  Servlets JSP Kid Web Services Portal Extra Logic Access Log  Swing GUI Categories Content Admin

  26. Jump Start to Swing – Tomorrows Lab – • SOFTENG 350 Organizational Stuff • Introduction to User Interface Technologies and System Architecture • Outline of the Assignment • Jump Start to Swing – Tomorrows Lab

  27. Your First Swing Program • Change the frame’s label • Change the pane’s text

  28. import javax.swing.*; public class HelloWorldSwing { private static void createAndShowGUI() { //Make sure we have nice window decorations. JFrame.setDefaultLookAndFeelDecorated(true); //Create and set up the window. JFrame frame = new JFrame("HelloWorldSwing"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); //Add the ubiquitous "Hello World" label. JLabel label = new JLabel("Hello World"); frame.getContentPane().add(label); //Display the window. frame.pack(); frame.setVisible(true); } public static void main(String[] args) { //Schedule a job for the event-dispatching thread: //creating and showing this application's GUI. javax.swing.SwingUtilities.invokeLater(new Runnable() { public void run() { createAndShowGUI(); } }); }

  29. Swing Application • Change the Look & Feel of the Swing Application • Change the semantics of the Swing Button, so that the background color of the Swing application changes if the button is pressed

  30. Summary • SOFTENG 350 Organizational Stuff • Introduction to User Interface Technologies and System Architecture • Outline of the Assignment • Jump Start to Swing – Tomorrows Lab

  31. Summary • SOFTENG 350 Organizational Stuff • Introduction to User Interface Technologies and System Architecture • Outline of the Assignment • Jump Start to Swing – Tomorrows Lab Questions ? draheim@acm.org Room 489 373-7599 x 88914 Lab ! Tomorrow 11-12 FTL

More Related