Week 13 - Final Web Presentation

Came to class early today..3 PM..all these while never able to make it..

Both groups present their websites..

Comments by Dr. Fandy?

Our Strength
- The Strategy

Cuboid Web
- Problem based learning - good
- clear strategy
- clear Problem Based Learning elements
- alternative real world
- ill-structured problem
- better compared to traditional website which has notes only
- 21st century skills emphasized
- notes has to be explored
- knowledge is scaffolded
- error checking
- simulation exist, even though its simple
- low cognitive load
- interaction design - easy to navigate
- visual design - appropriate color
- focused on scenario concept -

Network Topology
- attractive design
- based on scenario
- has multimedia elements
- experiential learning
- Forum - collaborative learning
- Notes are not important
- Icons - reduce cognitive load, uncrowded space
- video simulation
- induction set
- navigation - easy to navigate
- strategy is improved

Further Discussion
-------------------
Educational technologist
- an important person in US
- decide on the best technology for education
- can be in nursery, kindergarden, schools, universities, training centre

Scaffolding
- tiada pemberian nota
- knowledge is constructed
- there is a research on online scaffolding (Holland)

Cognitive Load
- ex: watch video in an unknown language, without subtitle - low cognitive load

Scenario Based Learning - in UTM

Johansen Penn State
- Hypermedia and Hyperlink
- Rich resources environment
- Scaffolding

Icons - Interaction Design

Google Glass - ambil gambar

Smart School
- transformation by computer scientists
- just convert everything into soft copy
- does not involve education people

evaluation
- login statistics

evaluation cookbook
- download PDF
- 1988 / 1989
- checklist for evaluate courseware, etc

Jumaat depan
----------------
- Evaluation - Analysis, survey, interview - 4 to 5 pages
- CD
- Final Report

Exam
------
4 soalan (10, 10, 10, 20)
Soalan no. 4, markah lebih banyak
markah 70, 30 untuk final
essay, no structure
facts

Completed the MPT1393 - Active Learning Web Design
The last class of my master coursework..

Now... getting ready for the finals.. the reports...

Week 12 - Publishing

Components of website publishing
1) Hosting
2) Domain

There are chargeable hosting and domain.
There also free hosting and domain.

www.freeservers.com
- has template

blog
- has template
- has widget
- space besar (berbanding dulu)

blogspot (google punya)
- gmail --> besar, simple, memenuhi keperluan pengguna
- pemasaran
- teknologi

Choosing a commercial web host
- reliability
- data transfer (traffic / bandwith)
- disk space
- technical support
- platform / os
- php, asp, cgi, mysql ftp, telnet
- SSL (secure  server)
- linux / windows / coldfusion - hosting


- trend hosting --> bertukar pada Apps
- 3 step untuk bangunkan apps
- flash baru, boleh terus tukar pada apps
- sekali upload di google play - USD25

ftp
- sangat mudah

File manager vs Ftp
- Commercial web host - File manager n FTP
- Free web host - File manager only (susah nak upload / download, file by file)

Example of commercial web hosting
- articulate x
- internet-webhosting.com
- wordpress.com (translation, template based)
- blogengin.net

kenapa perlu LUKIS design?
- Interaction design - participant design
- design datang dari USERS
- participant design - applicable to ICT website, Architecture, etc

Potential Research
- DESIGN sahaja can be a research on its own
- emotion in online learning - trend
- second life - free virtual environment (avatar)
- ineraction design - boleh sampai peringkat masters dan phD
- research mesti berdasarkan yang boleh dikembangkan dan dikecilkan scopenya dan menjadi
  sole expert dalam bidang tu
- University Rad.. Holland, menghasilkan nobel laureate prize winners
- setiap course perlu masukkan banyak unsur research - cadangan dr. henry


Degree
- melatih supaya boleh buat kerja

Masters
- specific bidang
- pakar dalam bidang yang general

pHD
- customized research
- pakar dalam scope bidang yang specific
- contribution of your knowledge

Waa! Enough topic for today, okay.. basically Dr. Fandy implied that the design business can be further explore, not jus in the website.. but also in petty teaching techniques...

Week 11 - Web Testing

Evaluation is a Part of Testing
------------------------------

Wow! Today there is a superb acting situation done by great actor / actress --> Asrul and Nadwa. Congrats!

Informal vs Formal Testing

Informal -  friend

Why Testing
- find a potentially serious problem
- give programmers helpful feedback

Content Expert /  Design Expert - important personnel in testing

1) Interaction Design
2) Visual / Interface Design
3) Information Design

Type of Error
1. Design Flaws
2. Conent Errors
3. Software / System Defects

Type of Testing
1. Functionality Testing
2. Layout Testing
3. Load Testing (image dipecahkan)
4. Link Testing (website on server, but still link to local)
5. Usability Testing (senang digunakan)

Acceptance Test
1. Alpha Testing (Design Expert / Content Expert)
2. Beta Testing (User)

Assignment Evaluation
--------------------------
Individu - mengikut theme
1) Cikgu - Content Expert
2) Design Expert
3) Student
4) Kawan

Kekangan untuk research - evaluation dari
1) kanak2 7 tahun ke bawah
2) OKU

Kekangan untuk research - elakkan
1) Form 3
2) Form 5

My Assignment Evaluation
---------------------------
1. Blog - 12/12
2. Web - 12/12
    Presentation
    Evaluation

3. Design Document -  settled

4. Evaluation Dr. Affandy, draw and upload
   - design ( ramai ?)
  -  observation

5. Evaluation - 19/12
          
6. Final Report - Final Week
    Design Documents
    Milestone chart
    Print Screen
    Role of Members
    All activities and tasks by members
    Evaluation
    Comment Pengkritik - elearning
    Case Study?


Ok.. hectic week starting.. well Diana ... you said once the school holiday starts, your assignments also start.. better start getting busy..

Week 10 - Web Discussion

Ok.. Dr. Dayana said that the final exam is ready, already submitted to faculty.. fuh..

Dr. briefed on the future topic web testing and implementation and the induction set that will be acted by Haslinda and Asrul.

Today, we main discussed about our group website project, the learning strategy, the content and so on...

I presented a new idea based on the comments by Dr. Fandy..

A new problem utilizing problem based learning strategy...

Week 9 - 50% Web Presentation

Agenda for today
1. Presentation
2. Other groups assess on interaction design, information design and content design
3. Post in forum

Recap Design Components
1) Interaction Design
2) Visual / Interface Design
3) Information Design

Prerequisite for MPT1193
Media Design + Authoring + Static / Animation

- Each element / layout must have reason
- Interaction Design is a very heavy concept, must take into account all aspects

  * Note *  Good and Popular Interaction Design
  1) Facebook (simple yet effective, tag, like)
  2) Handphone (interesting interaction)
  3) Wikipedia (simple to use)
  4) Google

Human Computer Interface

Apple - sales up due to good application of interaction design, no keyboard / mouse  (ipad, iphone)
          - partnership with Samsung
          - research interaction design

DESIGN YANG MEMUDAHKAN, DEKAT DENGAN PENGGUNA

Interaction Design parallel with Visual Design

 Multiple Intelligence Learning and HOTS

 Malaysian Students research on  Thinking Skills of UK students and Malaysian Students
Question on Fotosintesis
- UK, lines of answers
- Malaysia, a line of answer

Group 1
--------
- Idea ok
- Tak nampak identity
- Identity boleh terdiri daripada
  1) Warna (2 warna)
  2) Approach
- Improve Visual Design
- Is Cartoon acceptable for Form 3 students,  visit Disney website
- Problem Based Learning - research how PBL boleh dizahirkan dalam bentuk web (strong untuk
   Information Design)
- kukuhkan PBL
- ada database solution, response guru, response rakan, tips etc
- focus on one problem - kembangkan
- mula dengan masalah - scaffolding
- activity based
- very good approach that needs to enforced
- constructivism, learners construct knowledge - > PBL
- stress on learning path
- PBL - Form 3 Aras Tinggi

   Learning Path

                  stesen A                       stesen C                       stesen E
                       |                                   |                                    |
start ----------------------------------------------------------------------- end
                                      |                                     |
                               stesen B                           stesen  D


Group 2
--------
- ada identity / consistency
- Information Design - discovery learning tak strong
- Kaji Principles of Discovery Learning
- Visual Design OK
- Interaction Design OK- 'Explore'
- Focus on Topology - OK


 SUMMARY
--------------
- pegawai teknologi pendidikan
- BTPN - pengarah berstatus JUSA
- pemilihan bahan-bahan pendidikan - tanpa ilmu teknologi yang diperlukan
- pelajar sekolah boleh hasilkan bahan tapi tanpa konsep

- Professor Walter Louis (MIT) - Physics - search in YouTube

Conclusion
-----------
- Redesign website
- Redesign learning strategy
- Redesign problem

Week 7 - Information Design vs Visual(Interface) Design

A tidbit of information ...

What is the difference between courseware and web based?

Courseware (CD ROM based) - Flowchart has START to END
Website - There is NO START, NO END, it is all about user control

Information design
- it is all about Learning Strategy
- FOCUS FOCUS FOCUS!
- Focus on the purpose of the website, adopt the necessary plan to achieve that purpose

Side Note..
What is Authentic Learning?

Storyboard vs Thumbnails?

Simple answer:
A thumbnail is just one, single rough sketch, or a reduced size version of a full sized image. 

A story board shows a sequence of drawings, indicating a series of events. A storyboard CAN be made up of a series of thumbnail sketches.

Detailed answer:
Thumbnails are reduced-size versions of pictures, used to help in recognizing and organizing them, serving the same role for images as a normal text index does for words. In the age of digital images, visual search engines and image-organizing programs normally use thumbnails, as do most modern operating systems or desktop environments, such as Microsoft Windows, Mac OS X, KDE, and GNOME. 

Storyboards are graphic organizers such as a series of illustrations or images displayed in sequence for the purpose of pre-visualizing a motion picture, animation, motion graphic or interactive media sequence, including website interactivity. 

For me, after the lesson thought, Information design is the most important design component compared to interaction and interface design. Information design is the what makes a specific website a hit or a flop.  Developers should pay a lot of their attention to focus on this aspect.  

Week 6 - Interaction Design

Hu hu.. class is postponed. Dr. Dayana is not well. Luckily a friend send a SMS  right before speeding towards UTM.. he he .. no lah.. well... kind of..

p/s  shhh don't tell my husband

Self Learning : Review the published online notes..

INTERACTION DESIGN

- one of the major three design components - Interface, Interaction, Information
- keyword  :   interactivity
- keyword  :   navigation
- keyword  :   user control

A good interaction design - one of the deciding factor of a successful website

Week 5 - Basic Web Design (Good Website vs Bad Website)

Today, our lesson is about attractive websites..

A bit of comparison on previous and current websites

Previous

• Large Banner
• Hypertext
• Large Font
• Static Banner
• Colourful Display

Current

• Simple banner
• Hypermedia
• Small Font (10 - content, 12 heading)
• slide banner
• white background

Dr. Dayana described on a new trick to display a large picture on the website while maintaining upload time.  "Break the picture into several smaller parts.  On the webpage, combine the display"
There you go, large picture, short downloading time. Interesting!!

What is interesting about apple.com?

Me:  Attractive sliding iphone display

What is navigation breadcrumb?
Me: You cannot depend solely on me.. search the internet  :)

What is white space on the web page?
You: The white background
Me: Wrong!! It is the unutilized empty space on your website

Lecture: A Good Website Design
-----------------------------------
A good web design have
- quality content
- good technology
- good visual
- good economic (purpose)
- well structured
- easy navigation
- quick download time
- has balance
- has contras
- has focus
- is related

We searched the web for examples of good vs bad websites. Really there were tons of good websites and tons of bad websites..

Generally, I feel that the older designed websites lack focus, they tend to be excited on the web building tools rather than focusing on the purpose of the website.

The newer website concentrate more on the purpose, applying simpler display, ie white background, restricting the site to two or three colours only and emphasizen more on the economic (purpose).

Week 4 - Project Management in Web Design and Production

As usual, at the start of class, Dr. Dayana reviewd our knowledge on the learning theories and the related components about learning.

An education website should have

1)      Learning Strategy
2)      Learning Theory

A few Proposed Learning Strategy
1)      Inquiry based learning
2)      Problem Based Learning
3)      Cooperative Learning
4)      Collaborative Learning
5)      Personalized Learning
6)   Authentic Learning

 

Inquiry Based Learning

4 Basic Step
1)      Situation trigger
2)      Create Hypothesis
3)      Explore
4)      Create Conclusion

Learning Theories
1)      Behaviorist
2)      Cognitive
3)      Constructivism

*side note - White Background is the current trend for websites*

Collaborative vs Cooperative

Collaborative
-  The group is heterogenous
- Smart and less smart people
- Various background
- Has facilitator
- Scaffolding – make sure everybody participates..

Applying collaborative learning on a website

-          - Answer a few short question

-          - Same answer respond cannot be in the same group

Problem Solving vs Problem Based Learning

Problem Solving – eg. Math

Problem Based Learning – A Situation  that requires learning takes place

Group Presentation
1) Cooperative Learning
2) Problem Based Learning
3) Game Based Learning
My group presented cooperative learning...

Lecture - Project Management In Web Design

3 Phase Design
1) Interface Design / Visual  ==> Storyboard
2) Interaction Design / Interactivity  ==> Flowchart
3) Information Design / Content

Two types of testing in Web Design
1) Alpha Testing - Formative
2) Beta Testing - Summative

Alpha Testing - Test on Developer's Part
Beta Testing - Test on User Part

No wonder I have never heard of Microsoft's Alpha Testing.. :)

I think this class is really useful. I had deeper understanding to clarify the confusion between problem based learning and the problem solving. Although their differences are not clearly highlighted, they are two separate entities that need to be differentiated. The same confusion applied to collaborative versus coopeative learning... Well, as they said, when you learn more, the more you realized that your knowledge is limited...

THAT is why I attended this class, right Dr. Dayana and Dr. Affandy?  

Week 3 - Web Development Process

Ok.. this week groups were assigned.  I was sad because I couldn't be in the same group, my master course soul mate  :)

Anyway, happy to have new friends in my group. Luaskan ukhwah persahabatan..

1) Group 1 - Asrul, Vicky, Nadwa, Cikgu Diana

2) Group 2 - Junaidah, Afi, Cikgu Haslinda, Cikgu Rafidah

Major Assignment was discussed
----------------------------------------

1) Remember the blogging

    - Reflection of Weekly Lecture

2) Web Project Group - refer assignment document, include storyboard - continuous design

Remember storyboard??

Web page display		Description - What is the function of this web page - What is the requirement to get to this web page
Graphic: Nama File Get From Flickr, etc	Audio: File Name Duraton Voice over etc

 3) Individual evaluation - approach orang2 yang berbeza

Upon checking the course outline, there are other assessments
4) Problem based learning (Group)
5) Design Document (Group)
6) 50% Website Presentation (Group)
7) 100% Website Presentation (Group)
8) Final Report (Group)

Going to be busy this semester!!!

Lecture - Web Development Process
---------------------------------------------

Instrutional Design Model
- ASSURE, ADDIE, etc

- ADDIE is a popular version of ID model

*Good Reference*
http://www.slideshare.net/jamalharun/instructional-design-presentation

Learning Approach
- Problem Based Learning

- Inquiry Based Learning

- Collaborative Learning

Instructional Design
---------------------

ADDIE - Rosset

Waterfall

Dick and Carrey 

- Complex Model

- Pretest and Posttest - to achieve relevant objectives

- Pilot Test of a system - a process searching for reliability and validity of the instrument

Hannafin and Peck

- Assure model

- reliability vs validity 

- website validity - kesahan, approval from expert 

   --> subject matter expert / content expert

   --> related field website design expert - 1) interface 2) interaction 3) information

- website reliability - kebolehpercayaan, result acceptable

  --> pretest

  --> questionnaire

  --> posttest

     Pretest ->   Treatment ->   PostTest

Learning Theories

- Behaviorist, Cognitive, Consructivism

Social Learning Environment
- evolve from constructivism, with proper guidance from facilitator, initiate a topic, element of scaffolding

- Personalized Learning Environment - evolve from constructivism

Personalized Learning Environment Research 

FD - Field Dependent (everything is clear on the same slide)

FI - Field Independent (likes information in slide by slide)

Moodle + Mahara -> Mahoodle

Reflection
------------
ok... with the help of Dr. Dayana, we revisited all the learning theories, apporaches. A compuslory component that should be taken into account when designing our website project. This is an educational website, yeah?  It is also a very good input for us who are doing our Research 1. Have to restudy these concepts (hehe.. have I studied these things before..) before further discussion with research supervisor

Week 2 - Basic Concept of WebpageRe

Sadly, had to miss class today.

Had a meeting to attend with my school administrator. A meeting at a district level and was unable to hand it over to another teacher..

Based on the notes published in elearning,
1. A review of web site, web page, portal, blog, cms and lms
2. A review of the different types of website
3. A review of static website vs dynamic website

Can guess whether the educational websites are static or dynamic?

You're right. Dynamic is having its way...

Introduction to MPT 1393: Web-Based Multimedia Development

Ok. Here I am.. in one of the most waited class in my life.

Thanks to UTM which offerred the course for this semester, I managed to enroll myself in this class.  

My expectation of this class (without looking at the course outline) is that by the end of the course duration, I (or my team and I) will have developed a smart system that is published online. What kind of system?  Any system.

The course outline?

1. Identify concepts of developing educational webpage for the use of teaching and learning.
2. Apply instructional design models for developing a webpage.
3. Learn technologies that relate with a webpage deeply
4. Develop an educational webpage or portal that has teaching and learning elements.
5. Conduct an evaluation process of the webpage or portal that has been developed
6. Plan, upload and maintain the webpage in a computer server

He he... i forgot the teaching and learning part.  This is an educational technology course, is it not? Therefore, elements of teaching and learning is a MUST for this course. Sorry Dr. Noraffandy, wrong expectation.

Expecting more from you to guide us, Dr. Noraffandy and Dr. Dayana, in the weeks to come...

There were less than ten of us in this class.  That means there will not be many groups in here.  'Selamat berkenalan' my new coursemate.  Hopefully, we will learn a lot during this semester. Hoping I can get along well with my new group members as most of the assignments require group work.