Divi ile Oluşturulan 15 Mobil Uygulama Web Sitesi Örneği

Mobil uygulama endüstrisi her zamankinden daha popüler ve birçok uygulamanın özelliklerini ve avantajlarını göstermek için kendilerine ayrılmış web siteleri var ve hatta bir abonelik hizmeti ve çevrimiçi topluluk sağlıyor. Tahmin edebileceğiniz gibi Divi ile yapılmış çok sayıda mobil uygulama web sitesi var. Bu yazıda, bir sonraki mobil uygulama projeniz için size ilham vermek için Divi ile oluşturulmuş 15 mobil uygulama web sitesine bir göz atacağız.

Bu siteler mizanpaj tasarımı, renkler, yazı tipleri, resimler, gezinme, ürün fotoğrafçılığı, ürün açıklamaları, vaka çalışmaları, CTA'lar (harekete geçirici mesaj) ve daha fazlası için ilham almanıza yardımcı olabilir. Bazıları bağımsız uygulamalardır, diğerleri ise sensörler gibi diğer cihazlara bağlanır. Web siteleri belirli bir düzende değildir.

1. Yağ Haritası

Fat Map, bir bindirmede CTA ile tam ekran bir görüntü görüntüler. Bir üst mesaj çubuğu, menüdeki bir bağlantıya işaret etmek için bir ok kullanır. Kaydırma, bir indirme CTA'sı, haritaları vurgulayan büyük temiz bölümler, kısa metin ve resim içeren bir bilgi bölümü, medya logoları, konumlara resim ve metin bağlantıları, birden fazla resim üzerinden bir kayıt formu ve haritalara bağlantılar gösterir. Her konum için gönderiler, 3D haritaları görüntülemek için metin ve 360 ​​derecelik video içeren tam ekran görüntüleri kullanır. Site koyu gri ve beyaz arka planlar kullanır ve sayfayı temiz tutar.

2. FANGöz Sporları

FANSeye Sports, gerçek paralaks içinde kaydırıcı, slogan, video, CTA'lar ve sosyal takip simgeleri içeren tam ekran bir görüntü içeren tek sayfalık bir tasarıma sahiptir. Bunu takiben, özellikleri vurgulayan ve uygulamayı kaydırıcılar içinde görüntüleyen iki sütunlu birkaç bölüm bulunmaktadır. Tam genişlikte bir kaydırıcı medya logolarını gösterir. Frank Provenzano hakkında iki sütunlu bir bölüm, paralaks içinde bir arka plan deseni üzerinde bilgi görüntüler. Sonraki bölüm, ekip üyeleri, CTA, abonelik formu ve iletişim bilgileri içeren tam ekran bir görüntüdür. Site, markalı renkler, menü içinde bir CTA ve metin içeren dikey bir Başa Dön düğmesi kullanır.

3. Ejderha Meyvesi

DragonFruit, slogan ve CTA'lar içeren tam ekran bir çizim, gömülü bir görüntü, bilgi içeren iki sütunlu bir bölüm, bulanık arka plana sahip bir tam ekran görüntü kaydırıcı, bir referans kaydırıcısı, CTA ve tarz blog bölümü içerir. Ok düğmeleri, her sayfanın çeşitli bölümlerine gitmek için ekranda kalır. Çeşitli sayfalar, bilgileri görüntülemek için sekmeleri ve geçişleri kullanır. Renkler hedef kitleye hitap edecek şekilde seçilir.

4. Dclib

Dclib, slogan ve CTA ile tam ekran bir görüntü görüntüleyen tek sayfalık bir tasarım kullanır. Kaydırma, büyük simgeler içeren üç sütunda bir menü ve büyük bilgi bölümü, bir hakkında bölümü, üst üste binen resimli ekip, blog gönderileri ve bir resim üzerinde bir iletişim formu gösterir. Blog gönderileri, içeriği ortaya çıkarmak için geçişleri kullanır. İçerik ve ürün "yakında" aşamasında görünüyor, ancak düzen temiz ve simgeler markalı renkler kullanırken çok fazla beyaz alan kullanıyor.

5. Kara Kutu Performans İzleyici

Black Box Performance Tracker, görüntü ve CTA içeren tam ekran arka planı olan tek sayfalık bir tasarım (SSS sayfası hariç) kullanır. Kaydırma, ürün resimlerini, bir paralaks resmi üzerinde bir CTA'yı, bir CTA ile faydaları vurgulayan bir bilgi bölümünü ve tam ekran bir resim üzerinde bir iletişim formunu gösterir. Menü ayrıca bir CTA içerir. SSS sayfası, akordeonlar içindeki bilgileri görüntüler. Site markalı renkler ve yazı tiplerini kullanır.

6. hupla

hupla, bindirme ve etiket satırı ile tam ekran bir görüntü görüntüler. Kaydırma, gerçek paralaksta kaplama ve sloganlı başka bir resim, değişen arka plan renklerine sahip üç ürün bilgisi bölümü, paralaks kaplamalı bir resim üzerinde bir e-posta kayıt formu ve bir sosyal paylaşım CTA'sını ortaya çıkarır. Nasıl Çalışır sayfası, ürünü Slider Revolution kullanarak 3B dönen bir kaydırıcı içinde görüntüler. Site, renkli arka planlardan ve bindirmelerden harika bir şekilde yararlanıyor.

7. titreme

Quiver, paralaks, etiket satırı, CTA ve örtüşen ürün görüntüsünde bindirme ile tam genişlikte bir görüntü görüntüler. Kaydırma, hakkında üç sütunlu bir bölüm, bindirmeli paralaks içinde bir mesaj ve arka plan görüntüsü içeren bir bölüm, şirket logoları ile kaydırıcı, gömülü video, kayıt formu ile dolgu genişliği bölümü ve paralaks içinde bindirme içeren bir resim gösterir. Blog, markalı renklerle öne çıkan görseller kullanır ve temiz bir tasarıma sahiptir. Site, markalı renk ve beyaz boşluktan büyük ölçüde yararlanıyor.

8. GeoPro

GeoPro, CTA ile tam genişlikte bir görüntü içerir. Sonraki bölümde, ürün açıklaması ve resimleri, bilgi bölümü, markalı renklere sahip simgeleri kullanan bir ürün dökümü, CTA'lı değişken metin ve resim içeren iki sütunlu bilgi bölümü ve avantajlar listesinin yer aldığı örtüşen logo ve özel alt bilgi bulunur. CTA ile. Sayfalar benzer ancak kısaltılmış bir düzen kullanır. Bir sohbet özelliği ekranda kalır. Menü bir CTA içerir. Site, ürün fotoğrafçılığından ve temiz düzenlerden harika bir şekilde yararlanıyor.

9. TimesUppp

TimesUpp, CTA'larla bir bindirme içinde bir logo ve kısa açıklama içeren tam ekran bir arka plan videosu kullanır. Kaydırma, ürün özelliklerini vurgulayan büyük başlıklara sahip kısa metinler üzerinde ürün resimleriyle birden çok bölümü gösterir. Son olarak, iki sütunlu bir bölüm, CTA'lı bir resim içerir. Arka plan videosu konuyla alakalı. Düzen temizdir ve bilgileri dar bir sütunda ortalar.

10. Yozio

Yozio, etiket satırı, ürün açıklaması ve CTA ile tam genişlikte bir resim kullanır. Sonraki, logolar ve referanslar içeren müşteri vaka çalışmalarına bağlantılar içeren üç sütunlu bir bölümdür. İki sütunlu büyük bir bölüm, değişen düz tasarımlı çizimleri ve ardından bir CTA'yı içeren metni gösterir. Menü bir CTA içerir. Sayfalar aynı temiz tasarımı izler ve bindirmeli tam genişlikte görüntüler ekler. Site, renk markalama, görüntü bindirmeleri ve temiz düzenlerden büyük ölçüde yararlanır.

11. Prana

Prana, mavi bir arka plan üzerinde slogan ve ürün resmiyle birlikte tam ekran bir resim görüntüler. Bunu takiben, logolarıyla birlikte medyadan alıntıların olduğu bir bölüm var. Sonraki bölüm koyu bir arka plan kullanır ve ürünü vurgular. Sırada bir dizi gömülü video ve resim, renkli markalı simgelere sahip bir özellik listesi ve dikey olarak yığılmış çok sayıda bilgi bölümü var. Site, ürün fotoğrafçılığından mükemmel bir şekilde yararlanıyor ve ürün bilgilerini okunabilir bölümlere ayırma konusunda harika bir iş çıkarıyor.

12. MyWeatherCenter

MyWeatherCenter, degrade bir arka plan üzerinde paralaks içinde ürün resimleri içeren üç sütunlu bir özellik bölümü görüntüler. Sonraki, CTA ve referans içeren iki sütunlu bir bölüm, desteklenen ekipman ve vaka çalışmalarına bağlantılar içeren dört sütunlu bir bölüm ve üç sütunlu bir blog bölümüdür. Desteklenen Sensörler sayfası, geçişler içinde bilgileri görüntüler. Site basittir ve markalı renklerden büyük ölçüde yararlanır.

13. JouleBöceği

JouleBug, ürün açıklaması ve CTA ile tam genişlikte bir resim, tam genişlikte gömülü bir video, resimler ve bilgiler içeren resim kaydırıcı, bindirme ve CTA ile tam genişlikte resim, simgelerle medya bağlantıları ve CTA gösterir. Abonelikler sayfası faydaları, referanslı bir videoyu, paketleri içeren bir tabloyu ve haber bülteni kayıt formunu görüntüler. Bölümler paralakstaki görüntülerle ayrılmıştır. Site, ürün fotoğrafçılığı ve renkli markalamadan büyük ölçüde yararlanıyor.

14. Zonka Tablet Geri Bildirimi

Zonka Tablet Geri Bildirimi, ürün bilgileri, CTA ve her bir avantaj için simgeler içeren tam ekran bir görüntü gösterir. Bunu, indirme bağlantılarının olduğu bir bölüm, CTA'lı bir özellikler bölümü, ürün ayrıntıları ve resimlerin bulunduğu birkaç bölüm, vaka çalışmaları, paralaks içinde bir bilgi bölümü, tam genişlikte bir CTA, paralaks içinde, ürünü kullanan müşteri türlerini detaylandıran bir bölüm. CTA'lı ürün ve bağlantıları olan dört sütunlu bir altbilgi. Menü iki CTA içerir. Site, düzeni temiz tutarken birçok bilgi sağlar.

15. Müze

Muze, slogan ve CTA ile bulanık bir arka plan üzerinde tam ekran bir görüntü kullanır. Kaydırma, tam ekran bir CTA tarafından takip edilen özellikleri ayrıntılandıran küçük bilgi bölümleri arasında gerçek paralaks içinde ürün resimlerinin olduğu birkaç bölümü ortaya çıkarır. Kariyer sayfası, paralaks ve bir galeride çok sayıda tam ekran görüntü kullanır. Bu CTA, bir gradyan yerleşimi ile am görüntüsünün üzerine yerleştirilir. Bu, ürün resimlerini ve paralaksı zarif bir şekilde kullanan basit bir sitedir.

Son düşünceler

Divi ile oluşturulmuş bu 15 mobil uygulama web sitesi örneği, Divi'nin her tür mobil uygulama web sitesi için ilginç tasarımlar oluşturmak için kullanılabileceğini gösterir. .

Bu siteler, düzenler, renkler, resim kullanımı, video, gezinme ve daha fazlası için fikirler sağlamak için harikadır. Mobil uygulama web siteleri, ürün sergileme örnekleri için harikadır ve ayrıca ürün fotoğrafçılığı ve vaka çalışmaları için harika örnekler olarak hizmet eder. Bu web siteleri, bir sonraki mobil uygulama tasarımınız için size ilham vereceğinden emin.

Bu Divi mobil uygulama sitelerinin en sevdiğiniz öğeleri nelerdir? Aşağıdaki yorumlarda bize bildirin!

31moonlight31 / Shutterstock.com aracılığıyla Öne Çıkan Görsel