Entertainment on the Web
Anton Eliens
Basic Technology
•
•
•
•
HTML, HTTP, MIME
client / server architecture
client-side extensions
server-side extensions
see Glossary Web Terminology and Web Consortium
(W3C)
Client-side Technology
•
•
•
•
•
•
•
•
Style sheets (CSS)
Document Object Model
Math, Graphics - XML
Applets - Java
Helper Applications -- audio, …
Plug-ins - audio, video, animation, VR
Dynamic HTML - Javascript
ActiveX - from Visual basic to ... Java
Web Applications
•
•
•
•
•
•
combining servers and client-applications
multiple components
multiple technologies
(in construction) the ObjectWeb
‘the rest of us’ vs Microsoft
communication via IIOP
Basic Client/Server Pair
Managing Content (in the
ObjectWeb)
Netscape Enterprise Server
Microsoft Digital Nervous
System
Microsoft Dynamic Network
Architecture
Java applet with ORB
•Example - San Francisco Framework
Learning Support
• Collaboration Tools - XTV, NetMeeting,
WEB-4M
• Videoconferencing Tools - MBONE
(Vic/Vat)
• Web Tools - QuestWriter
• Cross-Platform Tools - Unix/X and 95/NT
• Environments - CUSeeMe: conferencing,
whiteboard, email, document sharing
Planning and Design
Step 1: Develop a list of educational goals.
Step 2: Identify implementation methods.
Step 3: Prioritize approaches.
Step 4: Design the structure.
Step 5: Design a page layout.
Navigation structures
• hierarchical - like a book, ...
• sequential - as a guided tour
• hypermedia - structural and associative
links
Guidelines
•
•
•
•
•
•
•
•
•
concentrate on content
good design is simple
legibility is the key
context must be clear
consistency means predictability
be accurate!
be unique ...
appearance must match purpose
support a variety of visitors
Page types
•
•
•
•
•
Home page
index pages
content pages
study guide pages
lectures - presentation pages
Technological limitations
• speed, resolution, colors, multimedia
Web Development Tools
•
•
•
•
•
•
Visual (HTML) Editors
Site Managers
Hypermedia Tools -- rejuvenated
HTML-Database Integration
Publication Wizards
Model-driven Web Generators
based on paper from Piero Fraternali (WWW7)
Issues in Concept Development
•
•
•
•
•
•
Choose a name!
Choose a class - micro or macro?
Choose a metaphor - literal is possible!
Develop a flowchart - navigation
User-centric - adaptive (cookie)?
Interactivity - email, form, bulletin, polls,
chat, ...
• User evaluation - is it effective?
Development Steps
1. Proposal - short summary
2. Description of purpose - economic model
3. Concept - type, site, metaphor, multimedia
4. Implementation facilities - CGI, Java, Shockwave
5. Cost - hardware, software, support
6. Time-table - research, production, development,…
7. Maintenance and upgrades - personnel
8. Expansion options - programming / administration
9. Appendix - flowchart and demographics
10. Business plan - funding and marketing
Metaphors for Sites
•
•
•
•
spatial - cities, solar system, room, backyard
representational - train, ship, radio
person or entity - home, tax-wizard
time or event - camera, mechanical arm,
fishcam
• literal - functional control (tables and lists)
Practicum Entertainment
Op het Web
• Stuur een multimedia briefkaart
• Vertel mee aan een verhaal
• Kijk rond op een Web-site
Creatief
Maak een mooie tekening
Maak een animatie
Creeer een 3D wereld
Virtuele Werelden
Vermaak jezelf in 3D
Bezoek een virtuele gemeenschap
Maak een praatje en dans
Software -- downloads
http://www.wdvl.com -- Web Developers Virtual Library
http://www.werbach.com/web/web.html -- Web Resources
http://www.paragraph.com -- MorphInk
http://www.blaxxun.com -- Blaxxun Contact 4.0
http://www.macromedia.com -- Shockwave plugin en Flash 3 Demo
http://www.ligos.com -- V-Realm Builder (Demo)
http://www.activeworlds.com -- Active Worlds
http://www.totallyhip.com -- Web Painter
http://www.cosmosoftware.com -- CosmoWorlds
http://www.satoripaint.com -- Satori Paint Programs
http://www.download.com -- various downloads
http://www.thefreesite.com -- more free stuff