15 Şaşırtıcı Code-Free Paralaks Scrolling Web Siteleri

Paralaks scrolling web tasarım dünyasında heyecanla tartışılan bir konudur. Trendin şampiyonu, meşgul web teklifleri ve ürün yelpazesini ziyaretçilerine sevdirmek adına devrimci bir yol olarak görmekteyim. Paralaks sevmeyenlerde bulunabilir, tasarımcıların büyük çoğunluğu, kullanıcılar ve site sahiplerinin ezici çoğunluğu müthiş animasyon efektleri yeterli bulmuyorlar.

Ancak buna rağmen, paralaks ile ilgili bir sorun veya en azından bir problem görünmüyor. Frontend ile vakit geçiren kişiler bu uygulamayı yapabilmenin bu aslında göründüğü kadar kolay olmadığını söyleyebilir. Neyse ki, bu sorunun cevabi oldukça kolay bir çözümdür.

Eylem fikirlerini ortaya koyduğumuzda:  (kodlama bilgisi) gelişmiş işlevselliği ile dışarı vurulan katlarını kendi web geliştirme deneyiminiz ile istediğiniz tasarım odaklı olarak sanatsal türlerini bulabilirsiniz. Son iki yıla baktığımızda bu eğilimi buharlaşmış olarak görünce, her web oluşturucu için tuz dökmek kadar kolay olan bu uygulamaya çözüm bulmak adına çabaladığını görüyorum.

Bugün her ne olursa olsun, herhangi bir kodlama gerektirmeyen, Paralaks scrolling uygulamalarının sanatsal olarak tasarlanmış web sitelerine birlikte göz atacağız.

Profesyonel Süit Tasarım Yazılımı Webydo ve Adobe Muse

Sürükleyici örnekler bizim tasarım dünyasında önce gelen iki ağır top ile birlikte geliyor: Webydo ve Adobe Muse.

Webydo

image0011

Webydo sofistike Cloud tabanlı SaaS profesyonel web tasarımcıları bireysel piksel gibi kendi tasarımlarının tam yaratıcılığının kontrolünü sağlar. Bu kapsamlı estetik gözetimi açıkçası çok cazip bir özelliktir, 100.000’den fazla profesyonel grafik ve tasarımcıya sahiptir, Webydo topluluğu birinin yetiştirilmesinde hiçbir zaman küçük bir rol oynamadı.

Webydo son zamanlarda dünyanın ilk ücretsiz Paralaks scrolling Animatör’ünü duyurdu. Bu benzersiz özellik, derinliği ile ima ettiği scrolling olaylarını tanımlamak ve kendi tasarım hareket yollarını belirlemek için profesyonel tasarımlar sunar. Animator halkoyu ile birlikte Webydo kullanıcılarına acık bir şekilde alışılmışın dışında ve eşitlikçi kalkınma sürecine doğrudan bir sonuç olarak gelir. Sunulan oyların arkasındaki fikir, profesyonel tasarımcılara doğrudan geri bildirimin yanı sıra, platformum kendisine sahiplenme duygusu sağlayan bir cadde gibi Webydo camiası sunmaktadır. Artan oylar sayılır sayıda, fikirler ile geliştirilen platform içerisinde yer almaktadır.

Tasarımcılar daha fazla kontrol edilebilir ve güçlü bir paralaks animatör sonuçlarını gördüklerinde, elbette bu çok etkileyici olmuştur.

Death-is-comming.info

image003

Death is comming web sitesi flat bir tasarım, üç boyutlu hissettirmek için yönetilir.  Kendi hikâye macerası adına, kanlı tapılası mahkûm tutulan bebeğin flat olarak tasarlanmış beyaz ağacın çevresinde ağaçlar döner. Tanımı gereği, olması gerektiği gibi yüzeysel bir derinlik vermektedir. Bu Paralaks scrolling bir paradoksalın harika bir kullanımıdır.

CBDesingsandPrinting.com

image005

Bir ama için animasyonlar: CBDesing siz gerçekten bir paralaks scrolling sayfası görmek istediğinizde ne olduğunu, animasyonlu efektlerin hepsi ile merkeze odak getirmek için yönetir.

Hosanafrossard.com

image0071

Hosana Frossard sitesi ile alakalı içerik dikkatinizi ve aşağı kaydırma gibi incelikli fade out ekran karşısında ince, zarif ve neredeyse soyut animasyonlar özellikleri ile gelinlik ısmarlayabilirsiniz. Tüm gelen ziyaretçileri geri döndürmek ve onları ikna etmek için gerekli sürükleyici bir deneyim sunmak için birleştirilmiştir.

Cafeteriadonamerces.com

image010

Sıcak renkler ve neredeyse kızartmaların kokusunu duyacak şekilde yüksek kalitede, Cafeteria Dona Merces arka plandaki kahve telvesi imajını yakından görmek, burada daha kurnazca Paralaks işlevselliği ile ilgi çekici ile içsel bir deneyim ve keyifli görüntüler sunar. Kahve, tatlı ve gıda maddeleri Kafe geçmişi ve çekici galerisi ile kaydırılarak odaklanılan ve iştah açan bir görünüm sunuyor.

Adobe Muse

image011 Webydo ile birlikte, Muse hiçbir kodlama deneyimi olmadan web site sahiplerinin daha profesyonel tasarım kalabalığına hitap eden başka bir web kurucusudur. Aslına bakarsanız, Adobe Muse orijinal belirtilen amaç ile birlikte web tasarımını uygun kılmak amacıyla geçerli bir kod içermeyen çözeltisi ile grafik tasarımlarını sağlamaktadır. Bu amaç dinamiği ilerlettirmektedir.

Bu web oluşturucusu gerçekten kapsamlıdır. Bu resim, eleman, içerik parçaları, düğme, üstbilgi, altbilgi, menü, galeri, sekme ve sayfada hayal edebileceğiniz her şeyi ekleyebilirsiniz. Muse içerisinde bulunan yazı tipi seçeneklerini gerçekten seyretmek için her anlamıyla bulunur.  Bir Adobe ürünü olduğundan, bu Typekit ile entegre olma yararı bulunuyor ve kolaylıkla tasarımları uygulamak adına web alanında size devasal bir seçim erişimi sunmaktadır.

Paralaks scrolling: Meşhur karmaşık ara yüzü sadece bu yüzden başka bir özellik eklenmiştir. Muse özellikle profesyonel grafik tasarımcıları için yapılmış gibi göründe de bizim seçtiğimiz örnekleri seyredeceğiniz harika bir manzara sunmaktadır.

Yslexperience.com

image013

Buradaki bazı yazılımlar profesyonel kullanım için planlanması nedeniyle oldukça başarılı bir şekilde göreceksiniz. Çoklu hareketli elemanları ve kolektör Paralaks animasyonlu efektleri bu siteyi görmeniz gerektiği kesindir.

Zensorium.com

image015

Düşünceli, sevimli, ilginç ve son derece hareketlidir. O web üzerindeki yüksek sesi ve net genelinde bu noktayı oldukça iyi vurgular. Tüm eşsiz özelikleri hakkında bilgi edinmek için sayfanın altındaki yolculuğunuz ile animasyonlu nesneyi izleyin.

Ok-Studios.de

Ön plana odaklanan origami üzerinden bu sayfanın derinliği sadece bir başlangıçtır. Bunun inanılmaz görünmesi için gerekli her sayfada parçalı hareketlerden bir ton mevcuttur.

Amatör DIY Paralaks Sağlayıcıları: Jimdo ve Squarespace

Jimdo

image019

Jimdo da bir online web oluşturucusu sunan popüler WYSIWYG web barındırma hizmetidir. 2007 yılında kurulmuş ve özellikle de İOS düzenlemesi için uygundur. Webydo veya Muse aksine, Jimdo oldukça profesyonel tasarımcılar daha amatör kalabalığa doğru daha dişlidir.

Onlar kodlama ve özelleştirme işlemini az sayıda gerektiren Premium temalar sunmaktadırlar. Temelde, her ne kadar sizin çalışan web varlığınız ile minimalist anahtar teslim hizmet vermektedirler. Ayrıca onlar Paralaks unsurları ile bazı Premium temalar da sunmaktadır.

Hizmet kesinlikle listemizdeki diğer web inşası gibi çok yönlü değil, Jimdo ortalama kullanıcı ve sürükle ve bırak işlevselliği ve boş bir tuval editör dâhil kullanışlı ve gezinebilir web sitesi üretmek için germekten ihtiyacı olan her şeye sahiptir.

Norladesign.com

image021

“Basit” Kesinlikle bu durumu uygulamak için uygun bir terimdir. Komplike olmayan bir arka plan görüntüsü oldukça doğal görüntünün önünde kayan sitenin içeriğini vurgulamak için hizmet vermektedir. Siz sayfanın altına doğru kaydırdığınız zaman aydınlatma armatürü kısaca yeniden belirsizleştirilir. Paralaks scrolling biraz fazladan cazibe sunarken bu minimalist tasarıma beyaz boşluklar hâkimdir.

Squarespace

image023

Şimdi higher end web yapılandırıcıları (Webydo/Muse) ve lover end Paralaks sağlıyıcıları (Jimdo) mümkün olduğunca aşina olduğunu ve bu kez bir şeyler hedefliyorsanız DIY web yapılandırıcıları creme de la creme ile biraz hazırlanmış olarak bulunmaktadır. Squarespace kendi ana pazarı olarak amatörlere yöneliktir.

Squarespace üç ayrı düzenleme sistemi kullanımı ile çalışır. Bu ekleme, silme ve sürükle bırak sayfa öğeleri yeniden düzenleyerek sürükle bırak işlevselliği ile esneklik sunarak harika bir olanak sunan etkileyici düzenleme editörüdür. Düzenleme modu başlıklar, altbilgiler ve sidebars spec özelleştirmeye yardımcı olur ve stil modu vb çzellikleri ile fontlar, boyutlar ve renkleri seçmenizi sağlar. Bu web oluşturucu onun hayatını kurtarmak için kod kullanılmaz ve profesyonel bir tasarımcı için para ödemek istemeyen kişiler için oldukça idealdir.

Son zamanlarda, Squarespace paralaks işlevsellik sunan yeni Marquee temasını açıkladı. Aşağıdaki örnekler paralaks’ın etkin teması ile mümkün olduğunca etkileyici sonuçları suna bazı vitrinleri sunuyor.

Todd-Richardson.com

image025

Bu kuşkusuz etkileyici Squarespace sunan yaratıcısından hızlı bir not:

image028

Taklitçi! Evet. CSS ‘le b’r ka. Satir paralaks sitesi ile listemizde gizlice girmeyi başararak eklendi, ama bu tamamen ücretsiz kod çözümlerine karşı yargılamak için iyi bir kontrol olarak görev yapacaktır. Hatta eklenen CSS ile web sitesi nispeten basit. Bir görünüm ızgarası sayfanın altındaki bilgileri “Hakkımda” standartlarını ortaya koyarak, aşağıya kardırarak tam sayfa görünümlü arka planı süslüyor. Sonuç ne olursa olsun cazip bir giriş.

Mademybump.org

image029

Şimdilerde iyi şeyler, belirgin bir şekilde farklı cihazlara hareket ettiğinden, birden fazla görüntü elde edebiliyor. Bump bu çadır tema sitesi (engelli kaliteli protez sunmak için kar amacı gütmeyen özel bir bağış kullanın!) Aynı zamanda arz edilebilen Squarespace scrolling paralaks sadece ne tür güçlü bir örnek sağlar.

Salvationtaco.com

Ben insanlara yalan söylemek istemiyorum.  “Salvation Taco” şimdiye kadar duyduğum bir restoran için havalı bir isim, bunu söylememin nedeni bu web sitesi burada olduğu için. Meksika yemekleri ve Katolikliğin çekici ve sanatsal kombinasyonu benzer otantik Tex-Mex için sağlıklı bir şey sunmaktadır.

Ama balık tacos benim benzetmemle dürüst bir değerlendirme yaptıktan sonra kendiniz diskalifiye edip etmeyeceğinize karar verin. Renk düzeni ve muhteşem klasik görünümü, hoş ve üçlü bir paralaks scrolling için gerçekten faydalı ve keyifli bir bit derinlik ve hareket sunar.

Bizim bu listemizde bulunan en sevdiğiniz paralaks sitelerinin bazıları nelerdir? Bu konuda bizlere görüşlerinizi bildirebilirsiniz.

Bu makale İngilizce’den tercüme edilerek düzenlenmiştir. Orijinal makaleye buradan ulaşabilirsiniz; 11 Amazing Code-Free Parallax Scrolling Sites



Barış Hepçorman

Barış profesyonel bir içerik pazarlamacısı ve ilham veren bir yazardır. Gündüz pazarlama müdürü, gece ise yazar, iş, pazarlama, tasarım ve web geliştirme üzerine birçok blog yazısı yazıyor. Web sitesi oluşturucular ve CMS ile çalışmayı ve deneyimini okuyucularla paylaşmayı seviyor. Onu LinkedIn'de takip edin