Fireworks Dersleri

Bildiğiniz üzere önceleri Macromedia Fireworks ismiyle tanınan bu yazılım satın alınma sonrası Adobe firmasının ürün ailesine dahil olmuştur. Adobe Fireworks temel olarak web tasarımı işlemlerinizi kolaylaştırmak amacıyla geliştirilmiş bir yazılımdır. Genel arayüz tasarımından öte hareketli resimler, açılır pencereler, css3 düğmeleri vb. hazırlayabilmenize olanak tanır. Hali hazırda bir Adobe Photoshop kullanıcısı iseniz ve photoshop programını web arayüz tasarımlarınızda kullanıyorsanız fireworks...  Fireworks dersleri



Fireworks indir
Programın 30 günlük deneme sürümünü Adobe sitesinden indirebilirsiniz.

Fireworks Dersleri : Web Arayüz Tasarımı ve Dahası

Adobe Fireworks Dersleri

Selamlar,

Bildiğiniz üzere önceleri Macromedia Fireworks ismiyle tanınan bu yazılım satın alınma sonrası Adobe firmasının ürün ailesine dahil olmuştur. Adobe Fireworks temel olarak web tasarımı işlemlerinizi kolaylaştırmak amacıyla geliştirilmiş bir yazılımdır. Genel arayüz tasarımından öte hareketli resimler, açılır pencereler, css3 düğmeleri vb. hazırlayabilmenize olanak tanır. Hali hazırda bir Adobe Photoshop kullanıcısı iseniz ve photoshop programını web arayüz tasarımlarınızda kullanıyorsanız fireworks pek ilginizi çekmeyebilir ancak içerdiği kimi özellikler web arayüzünü photoshop'a oranla daha hızlı tasarlamanıza aynı zamanda çıktısını html, css ortamlarında almanıza yardımcı olur.



Aşağıda web arayüz tasarımıyla ilgili ve tabi ilgisiz fireworks derslerini inceleyebilirsiniz.
Ancak ilk paylaşmak istediğim video budur. İngilizcede olsa fireworksun arayüz tasarımındaki duyarlılığını anlamada önemli.
Öğerlerin seçiminin kolaylığı, üzerinde değişiklik yapma hızı ve kolaylığı, kopyalanmış öğelerin birinde yapılan değişikliğin otomatik olarak diğer hepsine atanması gibi özellikler vurgulanıyor ki bunlar photoshop kullanırken dezavantajlı olduğumuz durumlar.
5 Things I Love About Adobe Fireworks for Designing Websites
http://www.youtube.com/watch?v=r4X28x9sdm4

Fireworks ile şablon tasarımı

http://vimeo.com/11137421

Fireworks CS6'da CSS Yenilikleri
http://vimeo.com/51347825

Web tasarım kursu
http://www.youtube.com/watch?v=yBrlCC-0ktA


İngilizce anlatımlar;
Fireworks cs6 ile css sprite uygulaması
http://www.youtube.com/watch?v=eZzNlZCiaC4

Fireworks to Html
http://www.youtube.com/watch?v=OM0d-8gUaxQ

İmajları dilimlemek
http://www.youtube.com/watch?v=2q4-CPNfaI8

Fireworks CS5 ile web tasarımı
http://www.youtube.com/watch?v=VK9ZK8qJZs0

Adobe Fireworks Kullanarak Web Sitesi Nasıl Yapılır
http://www.youtube.com/watch?v=hvi5m8tZHCs



Diğer başlıklardan farklı anlatımlar

http://www.dailymotion.com/video/xoyvte_fireworks-ornek-ders-http-oypa-org_tech

http://www.youtube.com/watch?v=FuyvrahGHRY

http://www.youtube.com/watch?v=eG_seGvX7zM




Adobe sitesinden tüm fireworks derslerine ulaşmak için tıklayın.


Fireworks indir
Programın 30 günlük deneme sürümünü Adobe sitesinden indirebilirsiniz.

En İyi Wordpress Temaları 2012

En İyi Wordpress Temaları

Selamlar,

2012 Yılı bitmeden bir adet en iyi wordpress temaları kolleksiyonu hazırlamak iyi olur sanırım. Seçenekler aşağıdaki gibi...
Solio - Wordpress Theme



Daha çok tasarımcılara, fotoğrafçılara hitap eden tek sayfa portfolyo wordpress teması.

Bazı özellikleri;

• Html5 Css3 Kodlama


• Tek Sayfa Tasarım


• Uygun, Uygun Değil Ayarı (iş alımı için)


• Filtrelenebilir Galeri


• Lightbox izleme

Ön izlemesine buradan bakılabilir ve yine aynı sayfadaki download kısmından temayı indirebilirsiniz.

Clean Response

http://www.flickr.com/photos/tasarhane/8118230494

Temiz ve yanıt veren (resposive için daha karizmatik bi terim lazım) açık renkler kullanılmış kaliteli bir wordpress teması. Yönetici panelinden çeşitli tema özelliklerini değiştibileceğiniz tema ayar paneli bulunmakta. Test etmek için bu sayfaydaki view demo linkine tıklayın. İndirmek içinse buy now kısmına tıklayarak ücretsiz üye olmak gerekiyor. Üye olunca ortaklık (affiliate) programınada girmiş oluyorsunuz. Yani ücretli temalarını satmasına yardım ederseniz pay alabilirsiniz.

Pitch

http://www.flickr.com/photos/tasarhane/8118348917

"Portfolyo ve iş teması" sloganı ve buna uygun teknik çizimi andıran tasarımıyla buz mavisi ve gri renkleri sonucu biraz soğuk olması hasebiyle ciddiyete bulanmış bir wordpress teması. Yok o kadar da değil cümle öyle geldi durduramadım :p

Bu sayfadaki preview linki önizleme için download linkide bildiğiniz gibi temayı indirmek amacıyla orada duruyor.

DISCUSSION, Kişisel blog teması

Skylark Temiz, sade ve uyumlu

NewsPress Wordpress haber teması indir

Caja portfolyo teması

Left değişik bir portfolyo teması

6noran.com'dan responsive tasarım nedirin tam açıklaması

Nedir bu Responsive olayı? Son zamanlarda birçok blog, forum ve hatta kitaplara konu olan Responsive Web Tasarım tekniği; tarayıcı ve çözünürlüklerden bağımsız olarak ziyaretçinin kullandığı cihaz ekran çözünürlüğünü baz alıp ziyaret edilen web sayfasının içeriğini (navigasyon, formlar, yazı, fotoğraflar vb.) uygun şekilde ölçeklendirip yeniden konumlandırması tekniğidir. Bu teknik sayesinde hazırlanacak web sayfaları, HTML5 & CSS3 teknolojileri kullanılarak masaüstü ve mobil cihazlarda sorunsuz bir şekilde görüntülenebilecektir.

Başka bir responsive tema ne demektir detaylı açıklamasıda burada.

Responsive kelime anlamı olarak ne demek onada turkcebilgi.com şöyle demiş.

responsive; 1. anlamı uyumlu; yanıt veren, mukabele gresponsivelyhevesli olaresponsivenesshevesli, cevap kabilinden; hevesli, cevap vermeye hazır.
2. anlamı yanıt veren. karşılık veren.

En iyi wordpress temaları konusu için kaynaklar:

http://www.noupe.com/wordpress/16-free-wordpress-themes-from-september-2012-72106.html

http://wpmu.org/top-10-free-responsive-wordpress-themes/

http://www.tripwiremagazine.com/2012/10/wordpress-business-themes.html

Css Örnekleri İçeren Kaynak Siteler

Css örnekleri bulabileceğiniz kaynaklar

Selamlar, Öncelikle standartlaşmış olan bazı ingilizce kaynaklar aşağıdaki gibi.

CSS Examples - W3Schools

Dynamic Drive CSS Library- Practical CSS codes and examples

CSS Drive- CSS Examples

CSS examples - pmob.co.uk

css Zen Garden: The Beauty in CSS Design

CSS Examples - Quackit.com

I'm not going to teach you CSS: Lesson 1


 

Türkçe kaynaklar

CSS3 box-shadow örnekleri Örneğin CSS Gradient Generator vs. gibi. Benzer bir durum kutu gölgelerinde(box-shadow) karşılaştım. Bazı kutu gölgeleme işlerini bir köşeye ...

CSS - Örnekleri - aeyStudio.com

Css ile yapılmış animasyonlu menü örneği

Benzer konulardan bazıları; Css menü yapımı Psd to css dersleri

Cinema 4d ve After Effects Hazır Şablonları

SelamunAleyküm, bu yazımızda ücretsiz olarak sunulan cinema 4d hazır şablon, introlarını paylaşacağız.
Video sunumlarınıza farklılık katmanıza yardımcı olacak bu şablonları kullanabilmeniz için programı kurmanız gerekmekte. Dosyaları indirmeden önce kullandığınız sürümle uyumlu olup olmadığınıda kontrol ederseniz iyi olur.





Meta Ball Intro v2.0 - Free Template
http://www.youtube.com/watch?v=1WnO6e9YBHs


Free C4d Intro Template
http://www.youtube.com/watch?v=eKQgeicC5ZI


Free Intro template
http://www.youtube.com/watch?v=JJ7_9GpMY3A

AMAZING FREE INTRO TEMPLATE (Cinema 4D + After Effects)
http://www.youtube.com/watch?v=jeI_BOiZwXU
Yorumda yazdığı gibi bazı eklentilere ihtiyacınız olacak.


Free C4D intro template ( .c4d project file )
http://www.youtube.com/watch?v=8IQV1mNjt_s

Download Cinema 4D intro template
http://www.youtube.com/watch?v=qj0-pRS4wrk



Free Cinema 4D and After Effects Templates

Psd'den Html'e Dersleri Kolleksiyonu (Psd to Css)

Psd to Css, Psd to Html Dersleri

SelamunAleyküm, Psd to Html veya Psd to Css (türkçe psdden cssye diyebiliriz) terimleri bilenler için oldukça popüler son senelerde ve bu konu ile ilgili döküman sayısı eskisine oranla baya bir artmış durumda.



Bu artışla beraber aranılan içeriğe bir yerden ulaşılabilmesi için hepsi bir arada tarzında bu konuyu hazırladım. Umarım işinize yarar.

Tabi google'a girip psd to css yazarakta çoğuna ulaşabilirsiniz ama gözüme çarpanları burada bir araya toplamaya çalışacağım.

30 Hands-on Tutorials for PSD to HTML Conversion

20+ Best PSD to XHTMLCSS Tutorials

Awesome Convert Blog Layout PSD to HTML/CSS Tutorials

15 Best PSD to HTML/CSS Tutorials for Web Designers

43 PSD to XHTML, CSS Tutorials Creating Web Layouts And Navigation

30+ Best PSD to HTML/CSS Conversion Tutorials

30 Easy To Understand PSD To HTML/CSS Tutorials

30 Tutorials On Converting A PSD To XHTML And CSS

20 Illustrative PSD to XHTML/CSS Tutorials

20+ Best PSD to XHTML/CSS Tutorials

A Collection of PSD to Html Conversion Tutorials

50 Best PSD To HTML Tutorials Of All Times

40 PSD to XHTML, CSS Tutorials to Create Web Layouts

20+ Best Tutorials to Convert Psd to Html/CSS

10 Best PSD to XHTML/CSS Tutorials

35 Most Useful PSD to HTML/CSS Conversion Tutorials

10 excellent PSD to HTML/CSS tutorials

9 Articles And Tutorials To Learn PSD To HTML Conversion

Hemen hemen hepsinde benzer konular mevcut ve çoğu kaynakda bunlar arasında.

Tabi daha sıkı bir aramayla daha güncel psd to css konuları yakalanabilinir.

Selamlar.

Tweetlerinizi Sitenizde Eklenti Kullanmadan Yayınlayın

Selamlar,

Tweetlerinizi Sitenizde Eklenti Kullanmadan Yayınlayın

Eğer twitter kullanıyor iseniz ve twitter üzerinde paylaştığınız tweetlerin wordpress sitenizde/blogunuzda otomatik olarak görünmesini istiyorsanız hemde bunu herhangi bir eklenti / plugin kullanmadan yapmak için dualar ediyorsanız çözümü aşağıdaki kod öbeğinde yatıyor.

Bu kod öbeğini kopyalayıp sitede tweetlerinizin nerede görünmesini istiyorsanız ilgili wordpress tema dosyasına yapıştırın.
Artık sizinde bir yayın akışınız var.

Tabi kod öbeğindeki şu satırı bulup kendi kullanıcı adınızı girmeniz gerekiyor.
$rss = fetch_feed('https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=tasarhane');

Eğer favori tweelerinizi görüntülemek isterseniz aynı satırdaki adresi aşağıdaki gibi uygulamanız gerekiyor
$rss = fetch_feed('https://twitter.com/favorites/tasarhane.rss');

Hayırlı olsun.

Kaynak olarak şura kullanılmıştır.

[php]
<?php
include_once(ABSPATH . WPINC . '/feed.php');
$rss = fetch_feed('https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=tasarhane');
$maxitems = $rss->get_item_quantity(3);
$rss_items = $rss->get_items(0, $maxitems);
?>

<ul>
<?php if ($maxitems == 0) echo '<li>No items.</li>';
else
// Loop through each feed item and display each item as a hyperlink.
foreach ( $rss_items as $item ) : ?>
<li>
<a href='<?php echo $item->get_permalink(); ?>'>
<?php echo $item->get_title(); ?>
</a>
</li>
<?php endforeach; ?>
</ul>
[/php]

Türkçe anlatımı beğenmeyenler için :p

Display Your Latest Tweets Manually

I have tried a few manual solutions for showing tweets on my websites, and my favorite comes from Chris Coyier of CSS-Tricks. His RSS fetching snippet is a quick and effective way to show the latest tweets from your account. The RSS address of your Twitter account is http://api.twitter.com/1/statuses/user_timeline.rss?screen_name=xxxxx (where xxxxx is your Twitter user name). For the tweets that you favorite, use http://twitter.com/favorites/xxxxx.rss. For example, the RSS for the latest tweets from Smashing Magazine is http://api.twitter.com/1/statuses/user_timeline.rss?screen_name=smashingmag; and to display only the favorites, https://twitter.com/favorites/smashingmag.rss. Once you’ve got your Twitter RSS address, simply add it to Chris’ PHP snippet.