C2 – Social Web – Week 05

Link to all Weeks     Week 1     Week 2     Week 3     Week 4 Week 5 Week 6 Link to this Class on MyKangan

Today’s Class

  • Units of Competency
  • Assessment 1
  • Feedback

Units of Competency

This class is a cluster of:

There will be one assessment delivered from:

  • ICAWEB413A Optimise Search Engines
  • ICAWEB424A Evaluate and Select a Web Hosting Service

Assessment 1

Students can work on this assessment until completion.

C2 – Assessment 1 SNS

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

C1 – Design Simple Webpage Layouts – Week 05

Banner_Cert IV WebBTech-designSimpleWebsite

Link to all Weeks     Week 1     Week 2     Week 3     Week 4      Week 5     Week 6      Link to this Unit on MyKangan

Today’s Class

  • Dreamweaver – Session 3
  • Feedback

Dreamweaver – Session 3

We will continue the Dreamweaver training on Adobe TV’s Webdesign Channel.

Adobe TV – Learn Dreamweaver CS5 & CS5.5

After entering the Adobe TV site (link above) you should see an icon with resources at the top of the window. Download these and install on your D-drive.

Note: You will not see resources unless you have sign up with Adobe TV (for free).

Placing Images on the Page (7:44)

Creating Links in Dreamweaver (11:10)

Understanding Style Sheets (2:23)

Controlling CSS from the Property Inspector (5:21)

Using Live View and CSS Inspect (7:58)

Simplified Site Setup in Dreamweaver CS5 (5:43)

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

Analyse Information + Assign Meta Tags – Week 3

Photo by dhester on morgueFile.com

Photo by dhester on morgueFile.com

Link to all Weeks     Week 1     Week 2     Week 3     Week 4      Week 5     Week 6

Content:

  1. Assessment 1
  2. Feedback

Assessment 1

Today we will work on Assessment HTML Website.

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

C2 – Social Web – Week 04

Link to all Weeks     Week 1     Week 2     Week 3     Week 4      Week 5     Week 6     Link to this Class on MyKangan

Icons-Social-Media

Today’s Class

  • Units of Competency
  • Assessment 1
  • Feedback

Units of Competency

This class is a cluster of:

There will be one assessment delivered from:

  • ICAWEB413A Optimise Search Engines
  • ICAWEB424A Evaluate and Select a Web Hosting Service

Assessment 1

Please complete the attached assessment task and upload on MyKangan by the due date.

C2 – Assessment 1 SNS

You can work on the assessment in class.

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

C1 – Design Simple Webpage Layouts – Week 04

Banner_Cert IV WebBTech-designSimpleWebsite

Link to all Weeks     Week 1     Week 2     Week 3     Week 4      Week 5     Week 6      Link to this Unit on MyKangan

Today’s Class

  • Follow up
  • Dreamweaver – Session 2
  • Feedback

Follow up on Previous Assessment and Work

How has everybody faired with the Assessment on Accessibility? It is due today, so please upload in class.

Please upload in ICA40311-ICTITW4N-ITGEN-2013-ICAWEB414A-DESIGN SIMPLE WEB PAGE LAYOUTS (sorry about the lengthy code).

Dreamweaver – Session 2

We will continue the Dreamweaver training on Adobe TV’s Webdesign Channel.

Adobe TV – Learn Dreamweaver CS5 & CS5.5

Creating new documents (5:23)

Adding structure to text (8:36)

Managing Assets in Dreamweaver (13:13)

Placing Images on the Page (7:44)

We worked to Managing Assets in Dreamweaver. Please watch the last video before next class.

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

Manage Quality Customer Service – Class 4

Link to all Classes     Class 1    Class 2     Class 3     Class 4     Class 5

Today’s Class

  • Assignment 1 Senza Nome
  • Class Task (Day 1 Task)
  • Feedback

Assignment 1 Senza Nome

In today’s class you will be able to work on Assessment 1 Senza Nome.

I will walk around and speak to students and assist.

Make sure to upload it to this link on MyKangan  before the class is over. Upload complete and incomplete works. You can always add to it and re-upload your work.

Class Task (Day 1 Task)

Afterwards you will work on the Class Task or Day 1 Task.

Only upload one or the other here: Upload Class Task to MyKangan

Thank you!

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

E-Learning and Games – Week 2

Based on photo by xandert found on morgueFile

Based on photo by xandert found on morgueFile

Link to all Weeks     Week 1     Week 2     Week 3     Week 4      Week 5     Week 6

Content:

  1. Game Genres
  2. Find 5 Educational Games (Task)
  3. Game Mechanics
  4. Homework
  5. Feedback

Game Genres

We will start off by comparing last week’s works by you. What definitions did everybody find?

Game genres are different from film genres. While film genres are related to a style of a film or an era a plot is set in, game genres relate more to the way a game is played. This is the actions a gamer needs to perform to succeed in a game. These actions are also called Game Mechanics. Game genres can also be classified by a viewpoint (eg First Person Shooter = FPS and Third Person Shooter = TPS or 3PS) or the style.

Examples are:

Action

Fast paced, player needs to be accurate and quick (eg shooting)

Racing

Competitive games that revolve around vehicles of all sorts racing against each other. Can be single player or multiplayer.

Example: Need for Speed

Sport

Anything about sports, either action of playing the sport with a character or simulation of making a team succeed. Most current sport games are hybrids of Action/RPG or Action/Simulation.

Examples: Fifa, Pro Evolution Soccer, Tiger Woods Golf, Football Manager.

Strategy

A genre that requires planning and thinking to succeed. There is real-time and turn-based strategy. Real-time that the game runs to a clock and that every players actions take place straight away. Turn-based strategy is more of a stop and go experience, players decide on their turns and then the game advances per turn.

Examples: League of Legends, Total War Series, Risk

Adventure

This genre is about solving problems, there may be puzzles, exploring, memorisation and twists along the way. Levels play a part, often there are areas that need to be explored. Most adventure games are hybrids with other games.

Examples: Tombraider, Myth

Simulation

Arcade

Puzzle

FPS – First Person Shooter

3PS/TPS – Third Person Shooter

RPG

Party, Dance , Rhythm

Children

Fitness

Edugames or Educational Games

Find 5 Educational Games

Research Educational Games!

Use the internet to find 5 games (including Ubisoft’s Rocksmith) that are current.

  • Describe the platform,
  • the technology,
  • game mechanics and
  • target audience as well as
  • learning material/topic.

Upload in form of a comment to this post with a link to game images and and info online!

Game Mechanics

Game mechanics are a topic that has created a fair bit of controversy over the years. People vary in their definition of what should be a game mecahnic. Below is a definition that we will use for this class:

A simple division between mechanics and rules breaks down into two things:

Mechanics are the actions you can perform

Rules determine the outcome and

gameplay is derived by balancing these two things.

So, to take a Tetris example:

The mechanics of Tetris are:

Turn a block

Drop a block fast

Destroy blocks by creating a line

The rules of Tetris are

  • Gravity, which accelerates in a stepped fashion according to score
  • Score, which increases in a stepped fashion according to created lines
  • Pile reformation, which determines the effects of a destroyed line on the blocks above.
  • The lose condition of whether the pieces reach the top
  • The next piece determinant, which selects what new piece will show after the previous one has landed.

Source: http://www.lostgarden.com/2006/10/what-are-game-mechanics.html Feb 2012

Homework

Please look at the sites/posts below on edugames or educational games or serious games during the week.

Try at least 3 games and be prepared to speak about them in class!

BBC Educational Games   ZaidLearn   75 Free EduGames to Spice Up Your Course

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

Analyse Information + Assign Meta Tags – Week 2

Photo by dhester on morgueFile.com

Photo by dhester on morgueFile.com

Link to all Weeks     Week 1     Week 2     Week 3     Week 4      Week 5     Week 6

Content:

  1. Introduction
  2. Applying Meta Data in HTML
  3. Create an Image for a Web Page
  4. Email the Example
  5. Student Examples
  6. Feedback

Introduction

Today we will look at how to create meta tags in HTML and where to place the information.

Applying Meta Data in HTML

Meta Tags for Web Pages

Create a HTML file with all the meta tags for:

  • keywords
  • description
  • author

Use the W3School’s TryItEditor or Notepad to write your code.

Follow this link to see how it is done: The HTML Head Element.

Save your html file and move to the next task.

Create an Image for a Web Page

Use photoshop to create a photo montage image like the one below.

Search for specific technique: Photomontage

Artform that became extremely popular in the early 20th Century. Particularly popular in German Expressionism and Dadaism. Click the images for links to the original images or sites:

Photomontage: Amir Ebrahim Photography

Photomontage: Amir Ebrahim Photography

Massive Attack - The Essential Mix

Massive Attack – The Essential Mix

Create the Image in Photoshop

Create a similar photomontage to the one above by Amir Ebrahim Photography. Find a photo to base it on and copy and paste layers and change the image colour and tone.

Make sure to apply the meta data to the final product before saving it as a JPEG and PSD.

Email the JPEG

Email the JPEG to me.

Student Examples

Below are examples by students:

to be posted

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

C2 – Social Web – Week 03

Link to all Weeks     Week 1     Week 2     Week 3    Week 4      Week 5     Week 6     Link to this Class on MyKangan

Today’s Class

  • Units of Competency
  • Last Week
  • Social Web in HTML
  • In-class Task

Units of Competency

This class is a cluster of:

There will be one assessment delivered from:

  • ICAWEB413A Optimise Search Engines
  • ICAWEB424A Evaluate and Select a Web Hosting Service

Last Week

Last week we discussed aspects of social networking and how we relate to it. Let us look at the class discussion in the Forum on MyKangan. (The link requires for you to be signed into MyKangan).

Some of the discussion points and evaluations:

Facebook

How interactive is the site?  The site is very interactive as a user can communicate with others through many ways (e.g messaging, chat, comments, statuses, posts, sharing media) 9/10

How intuitive is the navigation? Facebook isnt very inituitive, especially for beginners new users, there isnt really much of a tutorial on how to connect with friends, upload images, posts, etc. And the navigation is a little bit hard to use. 6/10

How responsive is the site (speed)? Facebook loads very fast on a desktop/laptop but i find it tends to be slow and laggy on a smart phone and can take awhile to load/refresh. 7/10

Advertisments: are there frequent ads, pop-ups or spam? The ads are all interesting to the user and related to a user’s “likes” (which could be books, movies, games, etc). 7/10

Visuals, layout and graphics: Facebook has a boring blue and white colour scheme, although the layout may be modern and clean it isnt very appealing, its too simple and boring. The website is very text based (especially if you have a lot of “friends” that post alot of statuses, etc), but it does have some images if someone has uploaded them. 4/10

Jesse’s verdict: 6.6/10

by Federico Viola – Thursday, 17 October 2013, 3:06 PM
Okay, I will try the 5 points on Facebook:
  1. How interactive is the site? Facebook is very interactive when it comes to interacting with other users. You can engage them in different ways from chatting to posting on their ‘wall’. I find the wall feature a bit corny and there is no wall anyway, so it is just a page in a text editing software. The fact that you can communicate with others, post songs, documents, videos, photos, graphics and links is excellent. Interactivity:9/10
  2. How intuitive is the site? Facebook is not very intuitive. When you are new to Facebook you do not quite know what to do. It is rather boring to look at and you cannot understand the navigation easily. You get better at it through experience. I would rate it: 5/10
  3. How responsive is the site? It is pretty fast. Mostly happy: 9/10
  4. Advertisements? I do not like ads, I hate pop-ups and that goes even more for spam. Facebook is good in regards to ads, their ads are targeted and generally of interest to me.8/10
  5. Visuals? What visuals? It looks like a text editor! Very boring in layout, in use of images and in colours: 2/10

Federico’s verdict: 6.7/10!

Linked In

  • Linked In is not very interactive because the site is now dated and the only interactions are when you email someone or they contact you.  The topics of interest are not very regular and there is not alot of activity on a daily basis. 6/10
  • The navigation is also dated and like many SNS sites it takes time to navigate around the site to get used to it. 5/10
  • Linked In site speed is fast and there is not a page load time problem. 8/10
  • Linked In doesn’t have ads although I have noticed that they are promoting ads like facebook style ads to appear in the near future.  All members have the ability to advertise their own business. 3/10
  • The visuals and graphics of Linked In are also dated and in need of an upgrade.  You cannot edit your own images to how you want them to look and the whole page layout is boring. 4/10
  • On Linked In you cannot search for a person unless you are logged in.  This makes it good for privacy reasons although if you want to use the paid version you can see who has been searching for you which seems to contradict the privacy aspects of Linked In. 5/10
  • Linked In is 80% text based and 20% images. 2/10

Paul’s verdict:  33/70!

Social Web in HTML

We will look at ways to include content in a Social Networking website and how to incorporate content from your website on another site.

You can use HTML to embed sound, video, websites and other objects.

Iframe

Iframe is a command that allows you to embed a website or a video into a frame. Example for code:

iframe code

Screenshot of Iframe

Screenshot of Iframe

Read more about Iframes on W3Schools!

Iframe for YouTube Video

You can embed a YouTube video with Iframe:

This code can be found directly on the YouTube website by clicking on Share and Embed:

YouTube provides the code that allows you to embed the file. The video viewing size can be changed on YouTube.

YouTube provides the code that allows you to embed the file. The video viewing size can be changed on YouTube.

Read more about YouTube Iframe on W3Schools.

Embed Sound and Objects

Read more about embedding sound, video and objects on W3Schools: HTML Media  HTML Object  HTML Audio  HTML Video

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!

C1 – Design Simple Webpage Layouts – Week 03

Banner_Cert IV WebBTech-designSimpleWebsite

Link to all Weeks     Week 1     Week 2     Week 3     Week 4      Week 5     Week 6      Link to this Unit on MyKangan

Today’s Class

  • Assessment 1 – Accessibility
  • Dreamweaver – Session 1
  • Feedback

Assessment 1 – Accessibility

We will read through this task together please click on the link to download the file. Follow the in-class discussion and make sure that you understand each question or ask the teacher in the presentation!

Assessment 1 – Accessibility

The assessment is due next week!

Dreamweaver – Session 1

We will commence Dreamweaver training. We will use the video tutorials provided on Adobe TV’s Webdesign Channel, but I would like you to open this online PDF to get you started: A Beginner’s Cookbook to Dreamweaver.

Adobe TV – Learn Dreamweaver CS5 & CS5.5

All numbers are the duration of the videos in minutes.

I do not expect that we will work past the 4th video, but students who are more advanced are welcome to work ahead.

Getting Started: What is Dreamweaver CS5? (3:23)

Note: Before you view ‘Defining a new Site’ create a folder with the name dw website and subfolder by the names: assets, CSS, images, notes, scripts and video.

Defining a new Site (4:42)

In class we worked up to here! We will continue with Dreamweaver next week.

Creating new documents (5:23)

Adding structure to text (8:36)

Managing assets in Dreamweaver (13:13)

Feedback

Please leave your feedback in form of a comment. Your feedback and suggestions will help me to make this blog more user friendly. Thanks!