• Buradasın

    SVG

    Özetteki ilgi çekici içerikler

    • HTML5 Testleri: SVG Etiketi Kullanımı

      Bu video, Emre Sabuncu tarafından sunulan HTML5 testleri serisinin bir parçasıdır. Emre, SVG etiketinin kullanımını göstermektedir. Videoda SVG etiketinin vektör tabanlı çizim yapabilme özelliği anlatılmaktadır. Emre, SVG etiketinin temel kullanımını göstererek çember, daire, dikdörtgen ve poligon gibi temel şekillerin nasıl çizileceğini adım adım açıklamaktadır. Ayrıca, şekillerin boyutlandırılması, renklendirilmesi ve köşelerinin yuvarlanması gibi temel özellikler de gösterilmektedir. Video, SVG etiketinin geniş çizim yelpazesine değinerek, daha detaylı bilgi için eğitim kaynaklarına yönlendirilmektedir.

      • youtube.com

    • CSS ile SVG Görsellerini Renk Değiştirme Eğitimi

      Bu video, Tayfun Erbilen tarafından Prototurk.com için hazırlanan bir eğitim içeriğidir. Tayfun, web geliştirme konusunda bilgi paylaşmaktadır. Videoda, beyaz bir ürünün farklı renklerde nasıl görüneceğini göstermek için CSS'deki mix blend mode özelliğinin nasıl kullanılacağı anlatılmaktadır. Tayfun, önce bir beyaz koltuğun SVG formatına dönüştürülmesi, ardından HTML ve CSS kodlarıyla bu SVG'nin üzerine renk değiştirme işleminin nasıl yapılacağını adım adım göstermektedir. Ayrıca jQuery ile renk seçici ekleme ve CSS ile bu renk seçici ile SVG'nin rengini değiştirme işlemleri de detaylı olarak açıklanmaktadır.

      • youtube.com

    • Zenfor'da Kullanıcı Bannerlarına Grafik Ekleme Eğitimi

      Bu video, bir eğitmen tarafından sunulan Zenfor forum yazılımında kullanıcı bannerlarına grafik ekleme konulu bir eğitim içeriğidir. Video, kullanıcıların "PNG ranklarımın görüntüsünü büyütemiyorum" sorusuna cevap vermek amacıyla hazırlanmıştır. İçerikte, Zenfor'da kullanıcı bannerlarının grafik destekli olmadığı, CSS ile hazırlanmış hazır bannerlar olduğu ve bunları biçimlendirmek için özel CSS sınıfına girilmesi gerektiği anlatılmaktadır. Eğitmen, SVG formatında grafik kullanarak kullanıcı sıralaması oluşturma sürecini adım adım göstermekte, mod rank ve kullanıcı rank gibi farklı sıralamaları nasıl oluşturacağınızı açıklamaktadır. Videoda ayrıca PNG ve SVG formatları arasındaki farklar, SVG'nin ölçeklendirilebilir vektör grafik olduğu ve bu nedenle daha avantajlı olduğu vurgulanmaktadır. Mobil uyumluluğu sağlamak için medya sorgularının kullanımı, banner sınıflarının kullanımı ve kodun daha az ve etkili hale getirilmesi için pratik yöntemler de paylaşılmaktadır.

      • youtube.com

    • SVG Nedir ve Avantajları

      Bu video, web dünyasına giriş için ücretsiz online web dersleri sunan bir eğitim içeriğidir. Video, SVG (Scalable Vector Graphics) kavramını tanıtmaktadır. SVG'nin geleneksel PNG veya JPG formatlarına göre esneklik ve çok yönlülük sağladığı, herhangi bir metin düzenleyicisi ile oluşturulabildiği ve herhangi bir tarayıcıda görüntülenebildiği belirtilmektedir. Ayrıca SVG'nin elde edilebilir olması sayesinde anahtar kelimeler ve açıklamalar eklenebileceği vurgulanmaktadır.

      • youtube.com

    • Yapay Zeka ile Piksel Görselleri Vektör Hale Getirme

      Bu video, bir eğitim içeriği olup, konuşmacı yapay zeka aracını kullanarak piksel tabanlı görselleri vektör hale getirme sürecini göstermektedir. Videoda "Vectorizer i" adlı yapay zeka aracının kullanımı adım adım anlatılmaktadır. Konuşmacı, Galatasaray logosunu örnek olarak kullanarak, PNG, JPEG ve GIF formatındaki piksel tabanlı görsellerin nasıl vektör haline getirileceğini göstermektedir. Vektör haline getirilen görsellerin SVG, EPS, PDF, DX ve PNG formatlarında indirilebileceği ve Illustrator'da rahatlıkla düzenlenebileceği belirtilmektedir.

      • youtube.com

    • Draw SVG Eklentisi ile SVG İkonlarını Hareketlendirme Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere Draw SVG eklentisi kullanarak SVG ikonlarını nasıl hareketlendirebileceklerini adım adım göstermektedir. Video, SVG ikonlarının ölçeklenebilir vektör grafikleri olduğu ve web sayfalarında bozulmadan kullanılabilen ikonlar olduğunu açıklayarak başlıyor. Eğitimde önce jQuery ve Draw SVG eklentilerinin sayfaya nasıl ekleneceği gösteriliyor, ardından Illustrator programı kullanılarak SVG kodlarının nasıl oluşturulacağı anlatılıyor. Son olarak, hazırlanan SVG kodlarının web sayfasına nasıl eklenip hareketlendirileceği örneklerle açıklanıyor.

      • youtube.com

    • HTML 5 ve CSS 3 Grafik Tasarımı Eğitimi

      Bu video, bir eğitmen tarafından sunulan HTML 5 ve CSS 3 eğitim setinin 22. dersidir. Eğitmen, izleyicilere grafik tasarım konularını adım adım göstermektedir. Video, kanvas kullanımı ile başlayıp SVG (Scalable Vector Graphics) grafiklerine geçiş yapmaktadır. İlk bölümde JavaScript kullanılarak kanvas üzerinde üçgen çizimi gösterilirken, ikinci bölümde SVG etiketleriyle daire, elips ve çokgen çizimi anlatılmaktadır. Ayrıca font değişimi, renk ayarlaması ve opacity değerlerini değiştirerek geçiş efektleri oluşturma teknikleri de detaylı şekilde açıklanmaktadır. Eğitimde özellikle SVG'de renk, kalınlık ve şeffaflık gibi özelliklerin nasıl ayarlanacağı ve X düzleminde opacity değerlerinin 0.6'dan 1'e doğru nasıl değiştirileceği gibi logo tasarımı için kullanılabilecek teknikler gösterilmektedir.

      • youtube.com

    • HTML Grafiklerinde SVG Kullanımı Eğitimi

      Bu video, bir eğitmen tarafından sunulan teknik bir eğitim içeriğidir. Eğitmen, HTML grafiklerinde SVG (Ölçeklenebilir Vektör Grafikleri) kullanımını anlatmaktadır. Video, SVG'nin ne olduğunu, avantajlarını ve temel özelliklerini açıklayarak başlıyor, ardından SVG etiketleri (circle, rectangle, ellipse, line, polygon, polyline, text, path) ve bunların kullanımını örneklerle gösteriyor. Daha sonra SVG'de gruplama, filtreler, gölge ekleme ve renk geçişi gibi özellikler anlatılıyor ve son olarak JavaScript ile SVG elemanlarına dinamik müdahale etme örnekleri sunuluyor. Eğitim boyunca eğitmen, SVG'nin ölçeklenebilir, kalitesi azalmayan ve JavaScript ile dinamik olarak değiştirilebilen bir format olduğunu vurgulayarak, SVG elemanlarının koordinatlarını değiştirme, renklerini ayarlama ve kare sayısını dinamik olarak değiştirme gibi pratik uygulamalar gösteriyor.

      • youtube.com

    • Tinkercad'de SVG Dosyasını 3D Objeye Dönüştürme Eğitimi

      Bu video, Yakın Kampüs kanalından Cengiz Kurtoğlu tarafından sunulan bir eğitim içeriğidir. Cengiz, izleyicilerden gelen geri dönüşler üzerine Tinkercad programında SVG dosyalarını 3D objelere dönüştürme konusunu ele almaktadır. Videoda, Batman logosu örneği üzerinden SVG dosyasının Tinkercad'e nasıl import edileceği, boyutlandırılacağı ve 3D objeye dönüştürüleceği adım adım gösterilmektedir. Cengiz, SVG dosyasının içe aktarılması, extrude işlemi, hole (delik) oluşturma, silindir ekleme ve gruplandırma gibi temel Tinkercad tekniklerini kullanarak 3D obje oluşturma sürecini detaylı şekilde anlatmaktadır. Ayrıca, maskot tasarımı gibi pratik uygulamalar da gösterilmektedir.

      • youtube.com

    • CSS'de Şekil Oluşturma Aracı Kullanımı

      Bu video, Fikret adlı bir eğitimcinin CSS'de şekil oluşturma aracı olan "clippad" sitesinin kullanımını anlattığı bir eğitim içeriğidir. Videoda, clippad sitesinin nasıl kullanılacağı adım adım gösterilmektedir. Fikret, önce bir konteyner alanı oluşturup, ardından bu alana clippad sitesinden alınan kodlarla şekil verme işlemini uygulamalı olarak anlatmaktadır. Önce bir çapraz bükme şekli, sonra bir yıldız şekli oluşturma örnekleri verilmektedir. Ayrıca, clippad özelliğinin tarayıcılar tarafından desteklenmediği ve SVG özelliğinin de benzer şekiller için kullanılabileceği belirtilmektedir.

      • youtube.com

    • Görselleri Vektörel Hale Getirme Rehberi

      Bu video, Yoruma kanalından bir eğitim içeriğidir. Sunucu, görselleri vektörel hale getirme yöntemini göstermektedir. Videoda "Vectorize.ay" adlı bir internet sitesi kullanılarak görsellerin vektörel hale getirilmesi adım adım anlatılmaktadır. Sunucu önce bir fotoğraf, sonra bir logo ve son olarak bir yazı örneği üzerinden işlemi göstermekte, her bir görselin nasıl yüklenip vektörel hale getirilip farklı formatlarda (SVG, PDF, PNG) indirilebileceğini açıklamaktadır.

      • youtube.com

    • Photoshop'ta SVG Formatında Kaydetme Rehberi

      Bu video, Molovay tarafından sunulan bir eğitim içeriğidir. Sunucu, Photoshop programında SVG formatında nasıl kaydedileceğini adım adım göstermektedir. Videoda, önce bir daire çizilip mavi ve beyaz renklerle boyanarak bir tasarım oluşturuluyor. Ardından File menüsünden Export seçeneğine gidilerek SVG formatı seçiliyor ve özel boyutlar girilerek (örnekte 500x500) kaydediliyor. Son olarak, kaydedilen dosyanın SVG uzantısına sahip olduğu kontrol ediliyor. Video, Photoshop'ta SVG formatında kaydetme işlemini öğrenmek isteyenler için temel bir rehber niteliğindedir.

      • youtube.com

    • Photoshop'ta Gelişmiş Dışa Aktarma Seçenekleri

      Bu video, Photoshop'ta 2019 versiyonu ile gelen gelişmiş dışa aktarma seçeneklerini gösteren bir eğitim içeriğidir. Video, Photoshop'ta dışa aktarma işleminin nasıl yapılacağını adım adım anlatmaktadır. Önce File menüsünden Export seçeneğine erişim, ardından farklı dışa aktarma seçenekleri (PNG, GIF, SVG, JPEG) ve bu seçeneklerin detaylı ayarları gösterilmektedir. Şeffaflık desteği, görüntü boyutları, meta bilgileri ve çözünürlük ayarları gibi seçenekler detaylı olarak açıklanmaktadır. Ayrıca, tüm çalışma alanını dışa aktarma seçeneği de gösterilmektedir.

      • youtube.com

    • Web Sayfalarında İkon Kullanımı ve SVG Oluşturma Eğitimi

      Bu video, bir konuşmacının sunduğu web sayfalarında ikon kullanımı ve SVG teknolojisi hakkında kapsamlı bir eğitim içeriğidir. Video, SVG'nin ne olduğunu ve web sayfalarında neden kullanılabileceğini açıklayarak başlıyor, ardından İcomoon platformu üzerinden ikonların nasıl kullanılacağını gösteriyor. Daha sonra Illustrator programı kullanılarak kendi SVG ikonlarının nasıl oluşturulacağı adım adım anlatılıyor ve son olarak seçilen ikonların bir set halinde nasıl oluşturulup web sitesine nasıl dahil edileceği gösteriliyor. Eğitim içeriğinde ayrıca font ve stil dosyalarının nasıl kopyalanacağı, ikonların boyutlandırılması ve renklendirilmesi gibi temel özellikler de detaylı olarak açıklanmaktadır. Video, web sayfalarında ikon kullanımını öğrenmek isteyenler için kapsamlı bir kaynak niteliğindedir.

      • youtube.com

    • CSS'de Animasyonlu Dalga Efekti Oluşturma Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere CSS kullanarak animasyonlu dalga efekti oluşturma sürecini adım adım göstermektedir. Video, Photoshop programında dalga şekli çizimi ile başlayıp, bu şeklin SVG formatında kaydedilmesi, ardından HTML ve CSS ile animasyonlu dalga efekti oluşturma sürecini kapsamaktadır. Eğitmen, önce Photoshop'ta dalga şekli çizimi yaparak başlıyor, ardından HTML'de bir div oluşturuyor ve CSS ile bu div'e before ve after pseudo-elementleri ekleyerek, keyframes kullanarak dalga efektini animasyonlu hale getiriyor. Video, basit bir dalga efekti oluşturma sürecini detaylı olarak göstermektedir.

      • youtube.com

    • Inkscape'de Adobe Illustrator Dosyası Açma ve Kaydetme Rehberi

      Bu video, bir eğitim içeriği olup, izleyicilere Inkscape programında Adobe Illustrator formatındaki dosyaların nasıl açılacağını ve kaydedileceğini göstermektedir. Videoda, vektörel bir logo örneği üzerinden adım adım işlem anlatılmaktadır. Önce SVG formatındaki dosyanın PDF olarak kaydedilip uzantısının .ii olarak değiştirilerek Adobe Illustrator formatına dönüştürülmesi gösterilmektedir. Ardından bu dosyanın Inkscape'te sürükle-bırak yöntemiyle veya "Open with Inkscape" seçeneğiyle nasıl açılacağı ve üzerinde değişiklik yapılabileceği açıklanmaktadır.

      • youtube.com

    • Temel Photoshop Dersi: Yeni Sanat Hazırlama ve Kaydetme

      Bu video, Arif adlı bir eğitmen tarafından sunulan temel Photoshop derslerinin ilk bölümüdür. Photoshop programına yeni başlayanlar ve temel öğrenmek isteyenler için hazırlanmıştır. Videoda Photoshop programının temel kullanımı anlatılmaktadır. İlk olarak programın açılış ekranı ve temel bölümleri tanıtılmakta, ardından yeni bir sanat hazırlama süreci adım adım gösterilmektedir. 750x750 piksel boyutunda bir şal örneği üzerinden yeni sanat oluşturma, ölçü ayarları, arka plan seçimi ve şeffaflık ayarları anlatılmaktadır. Son olarak, hazırlanan sanatın nasıl kaydedileceği ve farklı formatlarda (JPEG, PNG, SVG) nasıl paylaşılacağı açıklanmaktadır.

      • youtube.com

    • Box SVG Programı Tanıtım Videosu

      Bu video, bir eğitim içeriği olup, konuşmacı Box SVG adlı SVG dosya türünü düzenlemek için kullanılan bir programı tanıtmaktadır. Video, SVG formatının ne olduğunu açıklayarak başlıyor ve ardından Box SVG programının kurulumunu adım adım gösteriyor. Programın Windows, MacOS, Linux ve Chrome gibi farklı platformlarda çalıştığı belirtiliyor. Daha sonra programın arayüzü detaylı olarak tanıtılarak menü bölümleri, araçlar ve sağ panel gibi temel bileşenler gösteriliyor. Video, bir serinin ilk bölümü olup, ikinci derste programın araçlarının tek tek anlatılacağı ve kanalın logosunun değiştirileceği belirtiliyor.

      • youtube.com

    • SVG ile Tank Oluşturma Eğitimi

      Bu video, bir eğitmen tarafından sunulan SVG (Scalable Vector Graphics) kullanarak tank oluşturma eğitimidir. Eğitmen, Pablo CS adlı bir program kullanarak geometrik şekiller kullanarak tank oluşturmayı adım adım göstermektedir. Video, tankın geometrik şekillerden (dikdörtgen ve daire) nasıl oluşturulacağını anlatmaktadır. Eğitmen önce tankın parçalarını (gövde, tekerlekler, başlık ve mermi yuvası) tanımlar, ardından bu parçaları bir fonksiyon içinde birleştirerek tank oluşturma sürecini gösterir. Fonksiyon, yön bilgisine göre (up, down, left, right) tankın farklı pozisyonlarda nasıl görüneceğini ayarlamaktadır. Video, oluşturulan tankın ekranda nasıl göründüğünü göstererek sonlanmaktadır.

      • youtube.com
  • Yazeka sinir ağı makaleleri veya videoları özetliyor