• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Webpage & Multimedia Design- class01
 

Webpage & Multimedia Design- class01

on

  • 680 views

Course overview

Course overview
Internet and WWW
GUI
Web Design and process
Group Assignment01

Statistics

Views

Total Views
680
Views on SlideShare
680
Embed Views
0

Actions

Likes
0
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Webpage & Multimedia Design- class01 Webpage & Multimedia Design- class01 Presentation Transcript

    • WebPage & Multimedia Design
      - Print syllabus
      • Group assignment01: key words
      • print gp assignment things
      Class01:
      • Knowing each other
      • Syllabus review
      • Internet & WWW
      • Group assignment01
    • Course Overview
      Learning outcome
      Class schedule
      Assignments
      Contact
    • Course Overview
      Explore the basic knowledge of web production
      Demonstrate the effective utilization of web/multimedia technology
    • Rules
      Attendance: >15 mins count as absent. No more than 4 classes
      Attentive in class: no facebook / eating / make full use of class time
      Assignment: No late submission / re-submission ; 5 marks deduction per day applied.
    • Internet
      Imgsrc: http://depositphotos.com/2515879/stock-illustration-Internet-world-wide-web-design.html
    • Internet
      Email (1972)
      1st Bulletin Board System (1978)
      Domain name (1984)
      World Wide Web (1990) coined by Tim Berners-Lee
      Imgsrc: http://www.dn-trade.com/domain-name-trading.php
    • Internet
      1st Internet Browser – Mosaic (1993)
      Imgsrc: http://royal.pingdom.com/2011/01/12/internet-2010-in-numbers/
    • Internet
      1996 : ~45 million
      1999 : ~150 million
      2000 : ~407 million
      2004: ~600-800 million
      2010: ~1.95 billion
      2011(Q1):
      2,095,006,005
      Img src:http://royal.pingdom.com/2011/01/12/internet-2010-in-numbers/
    • Internet
      Top 10 languages used in the Internet
      Imgsrc: http://russiansphinx.blogspot.com/2011/01/place-of-russian-language-in-internet.html
    • Internet
      Facebook as of 2010: 518 million users
      Imgsrc: http://www.hubspot.com/facebook-for-business-marketing-hub/
    • Internet
      What is the difference between
      Internet & World Wide Web (WWW)
      Imgsrc: http://depositphotos.com/2515879/stock-illustration-Internet-world-wide-web-design.html
    • Internet
      Also known as “The NET”
      global data communication system
      Interconnected computer networks
      Use the standard TCP/IP (Internet Protocol Suite)
      Network of networks
      Software + hardware infrastructure
      Carries information
      Imgsrc: http://en.wikipedia.org/wiki/File:Internet_as_cloud.svg
    • Internet
      Source of news, facts and figures
      Communication
      Entertainment
      Banking & e-Commerce
      Educational medium …
      Any example from the above?
    • Internet
      Evolution of the web: http://evolutionofweb.appspot.com/?hl=zh
    • WWW
      World Wide Web / Web / W3
      A system of interlinked hypertext documents (accessed via Internet)
      Web page may contain multimedia objects: text, image, video…
      Tim Berners-Lee:
      Write the first browser, WWW in 1990
    • WWW
      URL: Uniform Resource Locator  where?
      IP add: Internet Protocol address  32-bit number
      Google.com
      74.125.71.147
    • WWW
      Imgsrc: http://en.kioskea.net/contents/www/navigateur.php3
      Website: a group of HTML files that are stored and connected to internet (collection of web pages)
      Distributed information system
      Web browser:
    • WWW
      Download/Upload
      Receive/send a file over the network
      Web pages are stored in computers called web servers
      Imgsrc: http://en.kioskea.net/contents/www/navigateur.php3
    • WWW
      Imgsrc: http://www.slideshare.net/wlakmal/01-introduction-to-internet-i?src=related_normal&rel=1948535
    • WWW: types
      Imgsrc: http://www.slideshare.net/wlakmal/01-introduction-to-internet-i?src=related_normal&rel=1948535
    • WWW: Portal
      Offers a variety of services
      Usually free
      Any example?
    • WWW: Portal
    • GUI
      Interaction with audience
      Users’ control
      Easy and clear way
    • Brief History
      ~1969: a research project in the states
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
      - Very slow speed (max 56K) via tel line connection
      - Sound of dial-up internet: http://www.youtube.com/watch?v=gsNaR6FRuO0
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
      • IE replaced Netscape during late 1990s
      • Erosion of browsers in 2003
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
      • 1995
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
      • Dot-com bubble in ~1995-2000
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
      • Search in 1998 with minimalist interface
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
    • Brief History
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • Brief History
      Imgsrc: http://www.slideshare.net/tijs/web-design-trends-for-2010
    • GUI
      Graphic User Interface
    • GUI
      Copy
      Imgsrc: http://www.pocketdos.com/tutorial_drdos_ins.htm | http://www.tech-faq.com/how-do-you-copy-and-paste-in-windows.html | http://youressential.blogspot.com/2009_03_29_archive.html
    • WWW - hyperlinks
      Allows readers to choose their own pathways (invented by Ted Nelson)
      Interactive browsing
      Imgsrc: http://www.webtechstrategies.com/marketing-options.php
    • Web Design - software
      Netscape composer
      Microsoft Frontpage
      Adobe Dreamweaver
      Adobe InDesign
      Adobe Muse
      Adobe Flash
    • Web Design - Process
      Imgsrc: http://www.sagemedia.ca/process.php | http://www.o2i.ae/?page_id=507
    • Web– Designer’s role
      • ~ architect
      • Know the brand
      • Know the audience
      • Know the content
      • Understand the web process
      • Communicate ideas to clients and audience
      • Design: Control the look & feel & consistency
      • Design: visually pleasing and easy to use
      • Design, Scripting, Coding and Testing
      • Professional web designer: expert in programming & coding
    • Group Assignment01: 10%
      Form a group of 3-4 people
      Pick a website that you think is good, why? (at least 5 pts)
      Pick a website that you think is bad, why? (at least 5 pts)
      You will receive a term for research & presentation
      e-book/ social media/ blogging/ instant messaging/ web feeds/ web2.0/ html5/ css/ jquery/ javascript/ flash/ podcast/ CMS
      Answer the question: How does the term relate to web design? Any example?
      Document the findings in a digital file (with screen capture/image) for submission
      Present to class on Class03 (~10 mins)
    • more reference book/text
      Smashing magazine: http://www.smashingmagazine.com/
      Site inspire: http://siteinspire.com/
      Web lol: http://designlol.net/
      Internet: http://en.wikipedia.org/wiki/Internet
      A brief history of the Internet: http://www.walthowe.com/navnet/history.html
      The role of aesthetics in Web Design (2007): http://www.nordicom.gu.se/common/publ_pdf/247_thorlacius.pdf