Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
HTML5 Canvas Animasyon Dersleri ve Javascript Oyun Yapimi
Highest Rated
Rating: 4.7 out of 5(52 ratings)
219 students

HTML5 Canvas Animasyon Dersleri ve Javascript Oyun Yapimi

Javascript Yılan oyunu yapımı,HTML5 Canvas dersleri ,Javascript ile oyun geliştirme ve programlama,Animasyon temelleri
Created byErsan Hocam
Last updated 8/2018
Turkish
Turkish [Auto],

What you'll learn

  • HTML5 Canvasın bütün temel özelliklerini ve metodlarını öğreneceksiniz.
  • HTML5 Canvas ve Javascript yardımı ile kendi oyununuzu geliştirebileceksiniz.
  • Programlama gücünüzü artıracak bir düşünme sistemi geliştirmeniz çok olasıdır.
  • Merakınız heyecana,mutluluğa ve eğlenceye dönüşecektir.(En önemlisi de bilgiye.)

Course content

8 sections53 lectures5h 57m total length
  • HTML5 Canvas Elementi Özellikleri ve Metodlarını Öğrenelim3:00
  • HTML5 Canvas Elemanını Oluşturma Html İçerisine dahil etme4:55

    Eski bir tarayıcı kullanıyorsanız HTML5 i desteklememe ihtimali var .Benim tavsiyem Chrome ya da Safari kullanmanız.HTML5 Canvas elemanını ister html içinde  ister javascript ile oluşturabiliyoruz.Bunla ilgili örneklerimiz ilerleyen derslerde.



  • HTML5 Canvas Koordinat Sistemi3:11

    Matematik bilgilerimizden hatırlarsınız  pozitif y kordinatı yönü yukarıya bakardı  canvas tuvalinde ise işler biraz farklı alışmak zaman alabiliyor dert etmeyin.

  • getContext özel sunum :)2:05

    Küçük bir sunum yapacağım ve sonraki derste uygulamalı olarak getContext() metodunu kullanacağız.


  • getContext Metodu Kodlama1:07

    HTML5 Canvas elemanını bir değişkene aktardık ve o değişken üzerinden getContext("2d") metodu uygulayarak Canvasın width ve height değerlerinin belirttiği alan artık çizim grafiğine dönüştü. Gelin buna da ctx diye adlandıralım :) 

  • fillRect() Metodu ve fillStyle Özelliği ile Dolgulu Dikdörtgen çizimleri6:30
  • strokeRect() Metodu ve strokeStyle Özelliği ile Kenarlıklı dikdörtgen Çizimi5:20
  • toDataURL Metodu ile Canvas grafik verisini elde etme4:27
  • globalCompositeOperation Metodu5:32
  • globalAlpha Özelliği ile Saydamlık2:50

    Dosya içerisinde derslerde kullandığım ızgara fonksiyonu var.Dikkat ederseniz ikinci parametresinde globalAlpha özelliğini değiştirdim ızgaranın.

  • shadow Gölge özellikleri ve Ayarları3:45
  • Save Restore ve ClearRect metodları (ÖNEMLİ)3:17

    Animasyon uygulamalarında sürekli bu 3 metod kullanılacaktır.Özellikle clearRect() metodu bizim için çok ama çok önemli arkadaşlar.

  • Path Metodları moveTo lineTo metodları7:36

    çizimlere beginPath() metodu ile başlayıp

    closePath() ile bitirmek daha doğru olacaktır .

  • Çizgi kalınlığı lineWidth Özelliği18:08
  • Rect Clip isPointInPath Metodları6:52
  • quadraticCurveto ve besierCurveTo metodları kullanımı8:24
  • arc ve arcto metodu12:14
  • setLineDash metodu ile kesik çizgi çizme4:43
  • IZGARA çİZİMİ3:49

Requirements

  • Temel html,css ve javascript bilgisi olması gerekir.
  • Animasyonları,çizim yapmayı ve üretmeyi seviyorsanız daha çok verim alacaksınız.
  • Her öğrenim sürecinin ilk aşamasında sancılı ve sabır gerektiren bir zaman aralığı vardır.(Renkli sunumlarla bunu da aşacağız)
  • Matematik ,geometri bilginiz asgari düzeyde olması şarttır.

Description


HTML5 Canvas ve Javascript ile çizim,animasyon ve oyun yapımı hakkında bilinmesi gereken tüm temel bilgiler ve canvas animasyon örnekleri bu kursta.Kurs içeriğini dikkatle inceleyin. Sizleri harika bir kurs bekliyor.

HTML5 Canvas etiketi ve Javascript kullanarak sıfırdan oyun nasıl geliştirilir ,Javascript ile oyun nasıl yapılır ? Eğer oyun programlamaya yeni başlıyorsanız Oyun geliştirmek için gerekli temel bilgileri içeren bu kurs tam size göre.Html5 ve javascript ile web oyunu tasarlamak ve geliştirmek için ne yapmak gerekir diyorsanız  html5 canvas animasyon ve çizim uygulamalarını içeren bu eğitim serisine başlamanızı şiddetle  tavsiye ederim.

Html5 ve Canvas ile animasyon  ve oyun oluşturmak zahmetlidir ama programlama gücünüzü geliştirecek bir çok sorunla karşılaşırsınız.

Çoğumuzun bildiği yılan oyununu yaparak öğrendiklerinizi pekiştirebilecek bir oyununuz olacak.Yılan oyunu çok basit bir oyun  evet  fakat  yılan oyununu geliştirirken siz de fark edeceksiniz  içinde bir çok algoritmalar  var sorunlar var  ...Web oyun geliştiricisi olmak isteyen  ve yeni başlayan arkadaşlara özellikle tavsiye ediyorum.Önce yürümesini öğreneceğiz sonra birlikte  koşacağız.

Haydi başlayalım ! 

Who this course is for:

  • Html5 Canvas ve Javascript ile çizim ,tasarım yapmak isteyenler ve basit animasyon oyun yapımına başlamak isteyenler.
  • Oyun geliştirmek için gerekli temel bilgileri öğrenmek isteyenler.