Bölüm – 21 - EEMB DERSLER

Transkript

Bölüm – 21 - EEMB DERSLER
25.11.2012
•
•
•
•
•
•
Bölüm: 21
Hiper Metin
Çoklu Ortam
Dünya Çapında İnternet (www)
Hiper metin (Hypertext)
Hiper ortam (Hypermedia)
Çoklu ortam (Multimedia)
Animasyon
E – Öğrenme
Birşeyler bulmak
Hazırlayanlar:
2009639006 - Alper KAYA
2009639016 - Deniz NACAR
1
• Hiper nedir?
 İngilizcede kullanılan hyper ön eki aslında
kelime anlamı olarak McKnight, Dillon ve
Richardson tarafından (1996) “-den,-dan
fazlası” olarak açıklanmıştır.
2
• Hiper metin nedir?
 Doğrusal olmayan metin olma özelliğidir.
• Metin; durağan grafik, resim, çizim veya tabloları
içeren düğüm ve bu düğümlerin birbirine
bağlanmasını sağlayan bağlantıların bir arada
kullanılmasıdır.
• Metin nedir?
 Okuyucuya doğrusal ilerlemeyi dayatan bir
yazı bütünüdür.
3
• Hiper ortam (hypermedia) nedir?
Metinle birlikte diyagram, animasyon, ses ve video
içeren hiper metinin genişletilmiş halidir.
4
• Çoklu medya bilgi gösterimi için birden fazla biçim
kullanan bir iletişim aracıdır. Başka bir deyişle,bir
materyalin birden fazla formda sunulmasıdır.
• Bilgisayarın karşısında oturup,bilgisayardan
yazılı,animasyonlu ve sesli bir metin indirmek.
Bazen bir metin de çoklu ortam
sayılabilir.
5
6
1
25.11.2012
• Animasyon, birkaç resmin arka arkaya hızlı bir
şekilde gösterilmesiyle elde edilen hareketli
görüntüdür.
• Geçmişte animasyonlar birkaç kağıda istenen
resimlerin çizilmesi ve kâğıtların hızlıca geçirilmesi
veya bir çemberin içine konup döndürülmesi ile
yapılıyordu.
Çoklu
Ortam
Hiper
Ortam
Hiper
Metin
7
• Günümüzde bilgisayar teknolojisi hem vektör hem
de piksel tabanlı animasyonlar yapılmasına olanak
sağlamaktadır.
• Animasyon teknikleri son zamanlarda
yapılan işlerle teknikte sınır
tanımadığını göstermiştir.
Genel olarak animasyonları
kategorize etmek gerekirse
3D, 2D, stop motion
en yaygın tekniklerdir.
8
• Flash vektörel grafiklerle animasyonlar
hazırlayabileceğiniz, bu animasyonların birbirleriyle
etkileşmesini sağlayabileceğiniz, bir web sayfası nesne
geliştirme programıdır.
9
10
• Nerelerde kullanılır?
 Bilgisayarda durumu ve ilerlemeyi göstermekte ve
görsellik katmakta
Şu anda kullandığımız PowerPoint programında
animasyonları, sunuma görsellik katmak için
kullanıyoruz.
İlerleme Çubuklarında
Meşgul imleçlerinde
 Eğitim ve öğretimde
 Canlandırılmış karakterlerde
3D filmler
11
12
2
25.11.2012
• Potansiyel olarak güçlü araçlar
 Tv ve arcade oyunların başarı notu
• Animasyon sektörü çok büyük ve ortaya birşeyler
çıkarabilmek için çok fazla emeğin harcandığı bir
sektördür.
• Animasyon yapımcılığının en büyük firması Pixar’dır.
• Ama
 Bu tür medyaların tam potansiyellerini nasıl
kullanacağız
• Bu nedenle
 Film yapımcıları,çizgi film çiziciler meslek
grubundaki herkesin bu işi öğrenmesi
gerekmektedir.
13
Yıl
Film
Oyuncak Hikâyesi
Kayıp Balık Nemo
Yukarı Bak
Oyuncak Hikâyesi 3
Yönetmen(ler)
Yazar(lar)
Bütçe
Gelir
John Lasseter
Andrew Stanton
Joel Cohen & Alec
Sokolow
Joss Whedon
30.000.000 $
361.996.233 $
Andrew Stanton
Lee Unkrich
Andrew Stanton
Bob Peterson
David Reynolds
94.000.000 $
866.592.978 $
2009
Pete Docter
Bob Peterson
Pete Docter
Bob Peterson
Thomas McCarthy
175.000.000 $
715.800.400 $
2010
John Lasseter
Ash Brannon
Lee Unkrich
Andrew Stanton
Rita Hsiao
Doug Chamberlain
Chris Webb
183.500.000 $
1.012.200.000 $
1995
2003
14
• Bilgisayarlar sadece bir şeyler göstermezler aynı
zamanda bir şeyler yaparlar.
• Örneğin:
i. Arama – HCI kitabının sitesini arama
ii. Etkileşim – Gömülü uygulamalar (Örn: kare
bulmaca)
iii. Adaptasyon(Uyum) – E-ticaret sitelerinin başka
şeyler satmak için öneride bulunması.
15
16
• Bilgisayar üzerinde
http://www.hiraeth.com/alan/misc/game/game.html
• Web üzerinde
• Taşınabilir cihazlarda
17
18
3
25.11.2012
• Yardım ve Dökümantasyon
 Hiper ortam sistemler ideal çevrimiçi kılavuzları
ve diğer yardım sistemleri için uygundur.
 Kullanıcı odaklı erişim sağlar.
 Bilgiler hiyerarşik olarak organize edilebilir.
 Ardışık seçimleri daha detaylı bilgi sağlar.
• Eğitim
 Animasyon ve grafik, öğrencilere olan şeyleri
gösterir.
 Ses,atmosfer ekler ve anlamayı kolaylaştırır.
 Doğrusal olmayan yapısı öğrencilerin kendi
hızlarında keşfetmesini sağlar.
 E-öğrenme
e-Class
19
20
•E-öğrenmenin olumlu yönleri
Öğrenci konuyu öğrenene kadar, konu üzerinde çalışabilir.
Zaman sınırsızdır.
Herkes kendi öğrenme hızında öğrenebilir.
Dünyanın diğer ucundaki bir kişinin bilgilerinden
faydalanılabilir.
Eğitim maliyetlerini dikkate değer anlamda düşürmektedir.
Kişi kendini en rahat hissettiği zaman ve mekanda konuyu
öğrenebilir.
• E- Öğrenmeyi kısaca tanımlayacak olursak elektronik
ortam aracılığı ile yapılan öğrenim diyebiliriz.
• Dikkat edilmesi gereken önemli bir husus e-eğitim değil
e-öğrenme olmasıdır.
21
22
• E-öğrenmenin olumsuz yönleri
 Eğitmenler, etkili birer e-öğrenmenin nasıl olacağını
öğrenmek zorundadırlar.
 Eğitmenler için geleneksel olan ders içeriğini çevrimiçi
ortama aktarmak zordur.
 Akademik anlamdaki dürüstlük
• Online eğitim alan öğrenciler için;
 Ölçme ve değerlendirmelerin türleri ve etkililiği
 Etkileşim eksikliği
23
24
4
25.11.2012
•
•
•
•
•
Sıradan bir ders? (2000’li yıllardan bir
derslik)
slaytlar, kalem
işaretleri
Geniş uzayda kaybolma
Yapı tasarımı
Navigasyon
Geçmiş ve yer imleri
İndeksler,dizinler,arama
Daha sonra geçerli
olan web arayüzü
üzerinden
25
• Kaybolma, kullanıcının tüm yapı içerisinde olduğu
yeri, oraya nasıl geldiğini ve olduğu yerden nereye ve
nasıl gideceğini bilememesi olarak tanımlanmaktadır.
• “Nerdeyim?”, “Nerdeydim?” ve “Nereye gideceğim?”
sorularını soran bir kullanıcı bu çoklu ortamlarda
kaybolmuş demektir.
• Bir hiper ortam birçok düğüm ve bağlantı
içermektedir. Kullanıcılar ise bu bilgi yığınında
kolaylıkla kaybolabilmektedirler.
26
Sorunu çözmeye çalışır / Soruları
cevaplamaya çalışır (Kendini tekrar
yönlendirir)
Nerdeyim?
Nereye gitmeliyim?
Nereden geldim?
Daha fazla zaman harcar
Kaybolmuş kullanıcı
Başarısız
Başarılı
Ortamdan çıkar
27
• Brown’a göre kullanıcılar bağlantılar ile bir yerden
başka bir yere gezinirken o sayfaya nereden ve nasıl
geldiklerini unutmaktadırlar. Burada kaybolma
nedeninin kullanıcının omuzlarına yüklendiği
görülmektedir.
• Araştırmacılar kullanıcıların hiper metin, hiper ortam ve
çoklu ortamlarda kaybolmalarının, kullanıcı veya
ortamdan kaynaklandığını belirtmektedirler.
29
Amacına ulaşmada
başarısız olur
Amacına ulaşır
28
• Kullanıcılar;
 Nerede olduklarını teşhis edememekteler,
 Daha önce ziyaret ettikleri bilgiye geri dönememekteler,
 Daha önce göz attıkları bilgileri hatırlayamamaktalar,
 Ortamdaki bilginin nasıl yapılandırıldığı ve bu yapıların
nasıl bağlandığı ile ilgili yanlış veya eksik kavramsal
modellere sahipler.
• Ortam yapısının;
 Sistem tasarımının kötü olması,
 Arayüz tasarımının kötü olması,
 Tasarlayanların tasarımı yaparken bile kendilerinin
kaybolmuş olabileceğidir.
30
5
25.11.2012
•
İyi yapılandırılmış bir hiper ortam;
 Kullanıcıların nereden geldiğini, nereye gideceğini
gösteren ipuçları vardır.
 Ayrıca her ekranda kullanıcıların tüm yapı içerisinde
nerede olduklarını gösteren açıklamalar, konu
başlığı, sayfa numarası gibi ipuçları vardır.
 Kullanıcıların kendilerini yönlendirmelerini sağlayan
ayrıntılı gezinme araçlarının bulunduğu bir ortamdır.
•
Az yapılandırılmış hiper ortam ise;
 Kullanıcıların gezinmesinin temel düzeyde verilen
ipuçları ile desteklendiği,
 Kullanıcıların kendilerini yönlendirmelerini sağlayan
genel/temel düzeyde gezinme araçlarının olduğu bir
ortamdır.
31
Hiper
Ortam
İyi
Yapılandırılmış
Az
Yapılandırılmış
Yapılandırılmamış
Gezinme aracının
yönlendirme
Düzeyi
Yönlendirme
yüksek
düzeydedir.
Yönlendirme
orta düzeydedir.
Yönlendirme
yoktur
Gezinmeyi
destekleyen
ipuçlarının
ayrıntısı
Ayrıntılıdır,
açıkladığı
durumu
ayrıntılarıyla,
açıkça anlatır
Temel düzeyde
ayrıntılıdır,
birinci düzeydeki
ayrıntıları
barındırmaktadır,
açıkladığı
durumu genel
olarak anlatır
Ayrıntılı ipuçları
yoktur
Kriterler
33
• Belli bir hiyerarşi içeren bir site dolaşımı oluşturmak ve
site içeriğini gereğinden fazla parçalara ayırarak
derinleştirmemek, yani tıklama sayısını gereksiz yere
artırmamak, dolaşımı kolay bir sitenin en önemli
özelliklerinden biridir.
• Hiper metin, hiper ortam ve çoklu ortamlarda
kullanıcıların gezinmelerine yardımcı olan gezinme
araçlarından bazıları şunlardır; bağlantılar, tarayıcının
veya ortamın sağladığı geri ve ileri düğmeleri
(butonları), menüler, dizinler, index olarak adlandırılan
ortamın ana sayfası, site haritaları, arama fonksiyonları,
ekmek kırıntıları listesi (breadcrumb lists).
35
32
• Kaybolmayı önlemek için tapı tasarımında alınması
gerekilen önlemler;
 Kullanıcıların aşırı bilişsel yüklenmelerini
engelleyecek sade arayüz tasarımları yapılabilir.
 Site haritaları, arama fonksiyonları vb. farklı türde
gezinme araçları ortamda kullanılabilir.
 Ortamı daha iyi tasarlayabilmek için ilkeler
geliştirilebilir.
 Bilginin ortamda nasıl yapılandırılacağı ve
gösterileceğinin inceleyen araştırmalar tekrar
yapılabilir.
34
• Haritalar hem gerçek hayatta hem de bu tür ortamlarda
gezinme sürecinde kullanılabilecek yararlı araçlardır.
Site haritaları; metinsel veya görsel olarak tasarlanabilir.
• Haritalar, ortamın ve ortamdaki tüm bölümler arasındaki
ilişkileri hiyerarşik olarak açıkça gösterdiği için
kullanıcıların ortamın yapısını
anlamalarında, daha iyi ve verimli
gezinmelerini sağlamada ve
ortam içinde kullanıcıların
yönlendirilmesinde
kullanılabilecek etkili araçlardır.
36
6
25.11.2012
• Bir web sitesinde, dolaşım esnasında sitenin neresinde
olduğunuzu gösteren ve breadcrumbs, Türkçesi ile ekmek
kırıntısı olarak ifade edilen hiyerarşik site yolu yapısını
kullanmak da site dolaşımını oldukça kullanışlı hale
getirecektir.
• Sitedeki bağlantılar mümkünse metin bazlı (text)
bağlantı olmalı.
• Görsellere de bağlantı verebilirsiniz ancak bunu site
genelinde çok yaygın olarak kullanmamanız tavsiye
edilir.
37
• Menü: Anasayfada genellikle içindekiler tablosu veya bir
menü ile konu ve alt konular listelenir.
39
38
• Bir kelimenin bağlantı olarak tanımlanması durumunda,
tarayıcıda farklı renkler kullanılarak ve altı çizilerek
vurgulanır.
• Bağlantının üzerine fare ile gelindiğinde farklı renkler
alabilir ve daha önce kullanılan bağlantılar, farklı
renklerle gösterilerek paragraflardaki normal metinden
ayrılabilirler.
• Bağlantının üzerine fare ile gelindiğinde görünen
açıklamalar, o bağlantının hangi sayfaya gittiğini veya
amacını anlatan birer
40
• Öğrenci bağlantılardaki renk değişimleri ile daha önce
ziyaret ettiği sayfaları ayırt edebilir.
• Kullanıcı beğendiği ya da yeniden kullanmak istediği
bağlantıyı yer imlerine kaydedebilir.
• Aynı zamanda bilgisayarda daha önce gezdiği tüm
bağlantıların kaydı geçmişim bölümünde yer almaktadır.
41
42
7
25.11.2012
• Dizinler:
• Alfabetik dizinler okuyucuların kitap sonlarında görmeye
alıştıkları ve kitap içerisinde bir kelime veya kavramı
ararken sıklıkla kullandıkları bir araçtır.
• Anasayfa (Index):
• Anasayfa, kullanıcının hiper ortama giriş yaptığında
karşılaştığı ve ortamda gezinmeye başlamak için
kullandığı ilk sayfadır.
• Anasayfa kullanıcıya hiper ortamın yapısı ve içeriği
hakkında genel bir bilgi verir.
43
• Arama:
• Hiper ortamın içeriği büyüdükçe arama seçenekleri
önem kazanmaktadır.
• Arama ile kullanıcı istediği belirli bir bilgiye kolaylıkla,
hızlı bir biçimde ulaşabilir.
•
•
•
•
•
•
•
•
•
•
•
•
44
•
•
•
•
Tek kelime için çok sayfada arama yapar
Daha seçici olması gerekir
Boolean arama
Sözcükleri birleştirerek mantıklı ifade oluşturma
45
46
47
48
http://www.tebd.gazi.edu.tr/arsiv/2008_cilt6/sayi_1/135-152.pdf
http://www.gefad.gazi.edu.tr//window/dosyapdf/2006/3/2006-3-251262-18-ebrukilicvecirinkaradeniz.pdf
http://alinweb.blogspot.com/2009/02/coklu-ortam-tasarm-ilkeleri.html
http://kafkeff.blogcu.com/hipermetin-ve-hipermedya/10134928
http://www.metu.edu.tr/~euzun/lectures/hypermedia_Erman.pdf
http://marjinalmarjinal.blogcu.com/hipermetin-hipermedyamultimedya/10082617
http://rainbowelt.blogcu.com/hipermedya-hiperortam-coklu-ortamnedir/10129516
http://yorgungencler.blogcu.com/cevdet-diktas/7798369
http://marmarabote.innovacube.com/2010/11/26/bdo-hipermedya/
http://www.bilim.org/google-seo.html
http://en.wikipedia.org/wiki/Hypermedia
http://tr.wikipedia.org/wiki/Animasyon
8

Benzer belgeler

IDI 1- Etkileşimli tasarım Kuralları 1.1. Etkileşimli

IDI 1- Etkileşimli tasarım Kuralları 1.1. Etkileşimli • Bilgisayarlar sadece bir şeyler göstermezler aynı zamanda bir şeyler yaparlar. • Örneğin: i. Arama – HCI kitabının sitesini arama ii. Etkileşim – Gömülü uygulamalar (Örn: kare bulmaca) iii. Adapt...

Detaylı