Introduction to web 2.0 technologies and educational application of web 2.0 applications

1. W O R K S H O P
W E D N E S D A Y , 2 3 O C T O B E R , 2 0 1 3
Introduction to Web Technologies
and Educational Applications of
Web 2.0
M D . S A I F U D D I N K H A L I D
E m a i l : k h a l i d @ l e a r n i n g . a a u . d k
p r o f e s s o r k h a l i d @ g m a i l . c o m

2. Plan for the Day
2
 Session 1:
 0815 - 0900: Educational Applications of Web 2.0
 0915 - 1000: Exercise - Reference Management
 1000- 1100: Exercise - Portfolio
 1100-1200: PBL, by Thomas Ryberg, Professor MSO.
 1200-1230: Lunch break
 Session 2:

3. Session 1
Objectives
1. To understand the concepts of ‘learning activities’ in relation
to ‘web 2.0 tools’
2. To integrate and adopt web 2.0 in relation to learning
activities

4. Mapping Web 2.0 and Learning Activities
4
 The trend of e- learning research and development has shifted
from ‘learning object’ to ‘learning design’, while passing
though four levels of increasing complexity.
 Digital assets – typically referred to a single file (e.g. an audio clip,
image or a video), in some cases called a ‘raw media asset’;
 Information objects – are structured collection of digital assets,
which are designed particularly to present information for
pedagogical or academic administration purposes;
 Learning activities – include the tasks performed by learning to
achieve learning outcomes in a learning environment while
interacting with people or resources.
 Learning design – are structured and interdependent sequences of
information and activities to promote learning
Source:
http://www.academia.edu/1495767/Facilitating_Adoption_of_Web_Tools_for_Problem_and_Project_Based_Learning_Activiti
es

5. Task Taxonomy
5
 Environment: ‘web-based’
 pedagogical approaches: ‘cognitive problem-based’ and
‘situative project based learning’
 interaction (who): ‘group-based’
 role (which): ‘group participant’
Source:
http://www.academia.edu/1495767/Facilitating_Adoption_of_Web_Tools_for_Problem_and_Project_Based_Learni
ng_Activities

6. Type
(What)
Technique
(How)
Personally subscribed or used web 2.0
tools
University administrated or
subscribed web tools
Assimilative:
Reading, Viewing, Listening
Reading, Viewing, Listening
All
- by all we refer to the tools mentioned
in this table
All
- by all we refer to the
tools mentioned in this
table
Information Handling:
Gathering, Ordering,
Classifying, Selecting,
Analysing, Manipulating
Concept mapping, Brainstorming, Buzz
words, Crosswords, Defining, Mind
mapping, Searching
MindMeister, Mindmap,
Wiggio, Diigo, Etherpad, Doodle,
Facebook, Box.net, Basecamp,
Delicious, Digg, Lectio, Zotero, Twitter,
Google Translator, Google Docs
Mahara, Moodle, Quickr,
Adobe Connect, First
class, AUB digital library,
VBN (vbn.aau.dk),
Projecter
(Projektbiblioteket)
Adaptive:
Modelling, Simulation
Modelling, Simulation Dabbleboard SecondLife
Communicative:
Discussing, Presenting,
Debating, Critiquing
Articulate reasoning, Arguing, Coaching,
Debate, Discussion, Fishbowl, Ice breaker,
Interview, Negotiation, On the spot
questioning, Pair dialogues, Panel
discussion, Peer exchange, Performance,
Question and answer, Rounds,
Scaffolding, Socratic instruction, Short
answer, Snowball, Structured debate
Google Groups, Google docs, Skype,
SignApp Now, Messenger (MSN,
Google & Yahoo), Facebook, LinkedIn,
Twitter, Prezi, iGroups.dk, Wiggio,
Google calendar, MindMap,
MindMiester, Blogger, Wordpress,
Lectio.dk, Mail (Gmail, yahoo, MSN
etc.), TeamViewer, LogMeIn
AAU mail, Mahara,
Moodle, Quickr, Adobe
Connect, First class
Productive:
Creating, Producing, Writing,
Drawing, Composing,
Synthesizing, Re-mixing
Artifact, Assignment, Book report,
Dissertation/thesis, Drill and practice,
Essay, Exercise, Journaling, Presentation,
Literature review, MCQ, Puzzles,
Portfolio, Product, Report/paper, Test,
Voting
Dropbox, Evernote,
Slideshare, Google Docs, One Note,
Box.net, Dabbleboard, Wordpress,
Blogger.com, Etherpad, LinkedIn, Prezi,
Pageflakes, Blogger, Zotero
Mahara, Moodle, Quickr,
Adobe Connect, First
class, VBN (vbn.aau.dk),
Projecter
(Projektbiblioteket)
Experiential:
Practicing, Applying,
Mimicking, Experiencing,
Exploring, Investigating,
Performing
Case study, Experimental, Field trip,
Game, Role play, Scavenger hunt,
Simulation
SecondLife SecondLife
6
Source: http://www.academia.edu/1495767/Facilitating_Adoption_of_Web_Tools_for_Problem_and_Project_Based_Learning_Activities

7. Features of Web 2.0 Tools Vs. Learning Activities
7
 Each web 2.0 tool has many features
 Each of the tool’s feature’s ‘integration’ in ‘learning
activities’ depend on both the ‘type (what)’ and
‘technique (how)’ of the activities.
 From Software Engineering viewpoint use

8. Information Handling
8
 Concept Mapping, Brain Storming & Mind Mapping:
 MindMeister, WiseMapping, Padlet, Linoit
 Searching:
 Google Scholar
 Reference Management
 Zotero
 Social Bookmarking:
 Delicious, Diigo
 Analysing, Manipulating
 Word clouds: Wordle, tagxedo

9. Communicative:
Discussing, Presenting, Debating, Critiquing
9
 Discussing/Presenting
 Google Hangout
 Skype
 Slideshare
 Groupware
 Facebook
 Wiggio

10. Productive: Creating, Producing, Writing, Drawing,
Composing, Synthesizing, Re-mixing
10
 Creating/Producing/Writing/Composing
 Google Docs, Crocodoc
 Dropbox
 Titanpad
 Drawing
 Gliffy
 Diagramly/Draw.io
 Padlet
 Synthesizing/Re-mixing
 Presentation: Prezi,
 Portfolio: Academia, Researchgate, Linkedin
 MCQ/Voting: Doodle, Google Docs

11. Session 2
Objectives
1. To know about the architecture of world wide web
2. To know about client-server architecture of web applications
3. To know about typical scripting languages and database
platforms to develop web application
4. To explore PHP-MySQL application development
environment

12. Architecture of WWW and Client-Server
Architecture
12
 ” The World Wide Web (WWW, or simply Web) is an
information space in which the items of interest, referred
to as resources, are identified by global identifiers called
Uniform Resource Identifiers (URI).
 Examples such as the following travel scenario are used
throughout this document to illustrate typical behavior
of Web agents—people or software acting on this
information space. A user agent acts on behalf of a
user. Software agents include servers, proxies, spiders,
browsers, and multimedia players.”
Source: http://www.w3.org/TR/webarch/

13. Client-Server Architecture
13
Source: http://contentdeliverance.com/2011/client-server-architecture/

14. Three-Tier Architecture
14
Three-tier
architecture is
a client–server
architecture
Source:
http://en.wikipedia.o
rg/wiki/Multitier_arc
hitecture

15. Software Technology Platforms of Web App
15
 Popular platforms are:
 J2EE with PostgreSQL
 PHP with MySQL
 Ruby on Rails and MySQL
 PHP with Amazon AWS and SimpleDB
 Microsoft .Net platform
 Open Source Software Sources
 http://sourceforge.net/
 Moodle LMS: http://bitnami.com/stack/moodle

16. Web-Server development environment
16
PHP-MySQL Services and Apache Server
 http://www.apachefriends.org/en/xampp.html
 http://www.mamp.info/en/index.html
 http://www.wampserver.com/en/
HTML Website
 http://www.htmltemplates.net/
 http://freehtml5templates.com/
 http://html5up.net/
 http://html5templates.com/
 http://www.html5mania.com/category/free-html5-
templates/