WEEK 9 : ANIMATION in FLASH

MOTION TWEEN

1. File > new > pilih Flash File (ActionScript 2.0) > OK.

3. convert to symbol > pilih Type: Movie Clip, Name: tembikai.

4. pergi pada timeline > klik kanan pada frame ke 45 > insert keyframe. 

dan akan keluar simbol seperti ini:

5. klik timeline frame ke 45 dan ubah kedudukan tembikai tadi kerana kita ingin membuat pergerakan pada tembikai itu. klik Shift dan pada frame yang sama gerakkan kekanan (klik shift agar pergerakkan tersebut sekata)

6. klik pada tembikai dan pilih Free Transform Tool > dan gerakkan tembikai arah clockwise (nak menampakkan kesan bergolek pada tembikai tersebut)

7. pergi timeline klik pada mana2 frame antara 1 hingga 45 > pilih create motion tween.

pastikan simbol anak panah muncul selepas itu. pergi pada properties > tick pada orient to path.

pergi pada Control > Play untuk melihat hasilnya...

============================================================

SHAPE TWEEN

1. File > new > pilih Flash File (ActionScript 2.0) > OK.

2.pilih Polystar Tool pada toolbar > lukis pada stage

3. pergi pada timeline dan pada frame yg ke 45, klik kanan > pilih insert blank keyframe

4. pada frame tersebut, buat bentuk yang lain pula, iaitu pilih bentuk bulat pula pada Oval Tool

5. pergi pada timeline, dan klik mana2 frame 1 hingga 45dan klik kanan > pilih create shape tween.

dan anda akan lihat simbol seperti ini akan keluar:

pergi pada Control > Play untuk melihat hasilnya...

===========================================================

WEEK 9 : INTRO to SYMBOLS

Graphics, Button & Movie Symbols

objek yang kita gunakan dalam Flash dipanggil simbol. simbol tersebut boleh dijadikan sebagai grafik, button dan movie simbol.

mengapa kita menggunakan simbol????

| automatik akan tersimpan dalam library dan boleh digunakan berulang2 kali tanpa memberi kesan pada size fail flash kita. |

| boleh digunakan dengan segera dan menjimatkan masa |

bagaimana ingin menukar setiap simbol ini menjadi simbol grafik, button dan movie?

untuk simbol grafik

1. file > new > pilih Flash File (ActionScript 2.0) > OK.

2. copy apa2 gambar dan paste ke dalam flash. 

3. klik kanan > pilih convert to symbol.

 

4. keluar popup seperti dibawah, isikan Name: e.g: Flower, Type: Graphic > OK.

5. anda boleh melihat perubahan pada library setelah anda menukar kepada simbol Graphic. 

 ulang langkah yang sama untuk simbol  button dan movie

=========================================================

WEEK 8: BERMULALAH PENGEMBARAAN FLASH..

Hii semua..berakhirnya pembelajaran Dreamweaver pada kelas yang lalu bersama bersama Prof Zaidatun, pada kelas kali ini kita akan belajar Flash pula dimana saya akan menggunakan Adobe Flash CS3 Professional sepanjang pembelajaran nanti. 

INTRODUCTION ADOBE FLASH CS3 PROFESSIONAL

~ Flash is a multimedia software that is used to design user interfaces and applications. 

~ Flash packs a lot of functionality into one easy-to-use program that can:

- create animated movies from scratch

- import graphic content created in other programs and use Flash to animate it.

- how the site will function and appear regardless of the browser used.

INTERFACE ADOBE FLASH CS3 PROFESSIONAL

Toolbar 

~ contains all the tools you need to draw and edit objects.

~ every symbols have their own functions.

~ that are option that can modify how the tools function.

The Tools panel displaying the four sections:

Tool - Contains drawing, painting, and selection tools.

View - Contains zooming and panning tools.

Colors - Contains tools for setting stroke and fill colors.

Options - Displays options for the selected tool that affect the tool's painting or editing operations.

Timeline

~ contains the frames of the animation and will display them in sequences from left to right.

~ when your animation is viewed, the viewer will see the frames in sequential order starting at frame 1.

Panel

~ Flash screen elements that give you easy access to the most commonly used features in Flash. 

~ help you view, organize, and change elements in your Flash document. 

~ can have different appearances or states and are categorized into different types based on function.

Properties Panel

~ contains the options you have for the tool/object you are working with.

Stage

~ display your animations, images, and other content.

~ the ares visible to users after you publish/export a finished project.

setelah mengenali interface, mari kita lihat hasil dibuat:

Garden Screen

No.	Tool Name	Fuction	Object
1	Selection tool	Selects, moves, and edits shapes and drawings.	Tree/flowers/clouds/hill
2.	Subselection tool	Modifies the anchor points and tangent handles of a shape’s path or outline.	Tree/flowers/clouds/hill
3.	Free transform	-Freely transforms objects, groups, instances, or text blocks. -Can move, rotate, scale, skew, and distort individual transformations or combine several transformations all at once.	Tree/flowers/clouds/hill
4.	Line tool	Draws the straight  line	Hill
5.	Oval	Creates circles and ovals composed of fills and strokes, just fills, or just strokes	Hill
6.	Rectangle	Creates rectangles and squares composed of strokes and fills, just strokes, or just fills.	Grass
7.	Pain bucket	Adds a fill inside a shape and can change the color of a fill.	Tree/flowers/clouds/hill/grass

selamat mencuba!!

REFLECTION MINGGU KE 7 : QUESTIONNAIRE & FORUM

hii..minggu ke 7 kami belajar bagaimana membangunkan halaman untuk soal selidik dan forum

QUESTIONNAIRE

1. bermula seperti biasa, untuk memudahkan kerja gunakan sahaja database sedia ada dan create new table baru pada phpMyAdmin dan namakan sebagai kuiz.

2. buka dreaweaver > new > blank page > php. sebelum taip pergi pada toolbar common > klik insert div tag > insert > form
3. untuk mmbangunkan soalan jenis soal selidik ini, kita menggunakan radio group, insert > form > radio group.
4. lengkapkan seperti rajah dibawah. lengkapkan mengikut soalan2 yang ada dalam soal selidik kita.
e.g: untuk soalan no. 2. jantina, masukkan value bagi setiap jawapan untuk digunakan ketika analisis nanti dan klik OK:

dan hasilnya:

(keseluruhan hasilnya seperti dibawah..)

3. insert submit button > simpan sebagai kuiz.php

4. pergi pada server behavior > insert record > setting seperti dibawah dan klik OK (thank.html akan dibuat kemudian) :

5. bina halaman thank.html 

QUESTIONNAIRE: ANALYSIS

mengapa soal selidik selalunya dibangunkan? semestinya adalah untuk kita menganalisis setiap jawapan yang telah dipilih oleh responden. jadi langkah seterusnya adalah cara bagaimana untuk menganalisis soal selidik dengan menggunakan Dreamweaver CS3 (ingat SPSS je ke bole..ahaksss)

jika pergi pada phpMyAdmin, anda akan lihat maklumat seperti ini akan dipaparkan, iini adalah merupakan analisis yang dibuat berdasarkan responden yang telah menjawab soal selidik tadi.

dengan menggunakan drewmaweaver, kita boleh menentukan sendiri analisis yang ingin dibuat, contohnya kita ingin melihat berapa responden LELAKI. jom tengok tutorial..

1. File > new > php > insert table > taip text seperti berikut > insert record > pilih connection dan table yang kita tentukan > column tick all > filter: jantina, entered value , 1 (berdasarkan value yang telah anda letak tadi, iaitu lelaki = 1, perempuan = 2) > OK :

2. pergi server behavior > display record count > display total record > pilih recordset mengikut nama yang dinamakan tadi iaitu lelaki > OK

dan paparan pada google:

kerana hanya seorang saja responden lelaki yang menjawab soal selidik ini..

seterusnya anda bolehlah mencuba pelbagai analisis dengan menggunakan recordset yang lain. 

selamat mencuba..

REFLECTION MINGGU KE-4 : MEMBANGUNKAN DYNAMIC WEBSITE ( .ASP)

hii..minggu ke-4 kami telah belajar membangunkan .asp website..jom kita tengok tutorial.

STEP 1 : MANAGING SITE

managing site ini penting sebelum kita membangunkan sesuatu dynamic website. berikut adalah step ringkas menggunakan dreamweaver cs3

1. sebelum tu pastikan laptop atau pc anda ada iis sebelum manage site (bagaimana? go to google>taip localhost pada url dan enter) anda akan lihat paparan berikut akan terpapar

2. create folder (go to computer > localdisck C > inetpub > wwwroot > 

alih cursor pada menu bar, cari site > new site > namakan site anda (e.g:project) > masukkan address url folder tadi (e.g: http://localhost/project) > next

3. pilih yes, i want to use server technology > pilih ASP VBScript > next > tick ayat atas sekali, edit and test locally (my testing server is on this computer) > tempat simpanan folder project simpanan anda (e.g: c:\inetpub\wwwroot\project\ > next

4. klik button Test URL untuk pastikan simpanan folder anda betul (kalau keluar succesfull berjayala tu, kalau unseccessfull sila check balik) > remote control : tick pada No > Done

STEP 2 : SETUP DATABASE

1. buka Microsoft Access 2010 > create database baru  > simpan database seperti gambar dibawah (C:\inetpub\wwwroot\data\)

2. create table seperti rajah dibawah dan simpan dalam folder C:\inetpub\wwwroot\data\ sebagai data.mdb dan tutup MS Access.

STEP 3 : SETUP CONNECTION

1. buka Dreamweaver > pilih ASP > pergi pada server behaviors > tekan + > pilih custom connection string > e.g: 

connection name: dmx ;

 connection string: 

"Driver={Microsoft Access Driver (*.mdb)};DBQ="& Server.MapPath("/data/db1.mdb") 

 pilih using driver on testing server

> klik pada button test (jika paparan menunjukkan "connection was made succesfully" anda telah berjaya connect pada database dan boleh buat langkah seterusnya. jika tidak berjaya perlu check pada connection.

2. buka halaman baru pada dreamweaver, file > new > blank page > ASP VBScript > Create

3. pilih insert > form > taip sebuah borang contoh seperti gambar dibawah. ruang kosong di sebelah menggunakan textfield (insert> form> text field)

 

4. pada ruang properties setiap textfield hendaklan dinamakan mengikut nama masing2 agar memudahkan kerja apabila kita ingin membuat insert record nanti.contoh pada ruang first name, pada ruang properties seperti berikut:

5. ulang sehingga column Address dan simpan fail sebagai contact.asp dalam C:\inetpub\wwwroot\project\

STEP 4 : USING INSERT RECORD

1. pergi pada server behavior > klik + > insert record > pilih connection yang telah anda buat sebelum ini, e.g: dmx

2. klik OK > simpan file.

STEP 5 : VIEW DATA FROM DATABASE USING RECORDSET

1. buka Dreamweaver, file > new > blank page > ASP VBScript > Create. simpan sebagai viewstudent.asp dalam folder yang sama.

2. bina table > pergi pada server behavior > klik + > pilih recordset(query) > klik Test untuk melihat sampel data yang telah masuk > klik OK. 

3. pergi pada Bindings tab > + > pilih RecordSet (Query) dan klik cancel. dan anda dapat lihat adanya Recordset yang telah dibuat tadi:

4. drag firstname pada column di sebelah firstname dan seterusnya seperti dibawah:

5. highlight semua dan pergi pada server behavior dan pilih repeat region dan pilih all records untuk pengulangan maklumat nanti.

6. simpan sebagai viewstudents.asp

hasilnya....

kesemua maklumat yang telah dimasukkan akan terpapar pada laman viewstudents.asp