Prak 14 - Mengubah Mock Up dalam Bentuk WordPress menggunakan Divi Builder

1. TujuanMengubah Mock Up Desain Web menjadi HTML menggunakan Wordpress2. AlatWordpress 3. BahanMock Up Desain Web
4. Dasar TeoriWordpress
Wordpress merupakan sistem manajemen konten (CMS) yang paling banyak digunakan di dunia. Lebih dari 30% website dibuatdi WordPress dan presentasenya masih akan terus meningkat!Secara umum, sistem manajemen konten adalah aplikasi web yang memperbolehkan pemilik, editor, dan author untuk mengelola website dan menerbitkan konten tanpa harus menguasai isltilah teknis dan bahasa pemrograman terlebih dulu
WordPress menggunakan PHP dan MySQL, yang ternyata didukung oleh hampir semua penyedia web hosting. Terdapat juga paket WordPress hosting yang menawarkan kelebihan dalam kecepatan, performa, dan keandalan website.
Kelebihan WordPress lainnya terletak pada tipe website yang bisa dibuat di platform ini. CMS ini memungkinkan Anda tak hanya membuat blog sederhana, tapi juga situs ecommerce, portofolio, newspaper, atau apa pun yang diinginkan.
Salah satu hal terbaik WordPress adalah CMS ini memiliki software antarmuka yang intutif dan mudah digunakan. Apabila Anda tahu cara menggunakan Microsoft Word, maka Anda tidak akan mengalamai kesulitan saat hendak mengoperasikan WordPress membuat dan menerbitkan konten semudah menjetikkan jari.
Selain itu, WordPress bersifat open-source dan bisa digunakan oleh siapa pun. Bahkan CMS WordPress memungkinkan jutaan orang di dunia untuk membuat website modern berkualitas tinggi - meski Anda masih pemula sekalipun.
Divi
Divi merupakan produk dari Elegant Themes yang digunakan untuk membangun theme dan juga membangun halaman website. Berdasarkan informasi yang ada di Elegant Themes kita dapat mempelajari fitur-fitur dari Divi Builder yaitu 
  1. Real Time Design, Ketika kita membuat perubahan disai padas suatu halaman, maka desain akan berubah secara instan pada saat itu juga. 
  1. Klik dan Ketik, Dengan menggunakan divi kita tidak perlu membuka panel untuk menambahkan content. Kita dapat dengan mudah melakukan klik dan memulai mengetik isi halaman.
  1. Customize Everything, Setiap elemen dapat dikuskom mulai dengan font, warna, ukuran, spacing dan juga custom CSS. 
  1. Responsive Editing,  Fitur ini akan menampilkan live responsive preview.
  1. Pengaturan yang Mudah, Kemudahan menambah baris dan kolom.
  1. Global Elemen, Sinkronisasi item yang bersifat global pada banyak halaman.
  1. 46 Content Element, Hingga pada tahun 2017, Divi memiliki 46 Content Elemen.
  1. Import dan Export,  Kita dapat menyimpan layout kedalam library untuk digunakan.
  1. Sedikit atau tanpa loading,  Divi Builder bekerja cepat, sehingga sedikit atau tanpa loading
  1. Premade Layouts,  Divi Builder menyediakan lebih dari 20 layout yang sudah dipersiapkan sebelumnya.
Divi builder ini berbayar dengan harga terjangkau. Untuk membuat kita tenang dalam melakukan development website, kita dapat membayar dengna license unlimited dan lifetime. Setelah kita menyelesaikan berkaitan dengan license kita dapat mendownload divi builder dan salah satu theme dari Elegant Themes.
5. TugasMengubah mock up kedalam HTML
6. Hasil PraktikumBerikut ini adalah hasil mock up versi html yang kami kerjakan
7. KesimpulanAwalnya kami membuat aplikasi untuk mobile, sehingga untuk membuat websitenya kami tidak ada mockupnya. Akhirnya kami sesuaikan dengan mockup yang kami buat untuk aplikasi. Beberapa fitur masih belum ditampilkan karena masih dicari bagaimana caranya.
8. Referensi
  • WordPress, 2017 "Pengertian Divi Builder”, [online] diakses tanggal 16 Desember 2018, https://www.proweb.co.id/articles/wp/divi_builder.html
x

Komentar

Posting Komentar

Postingan populer dari blog ini

Prak 10 - Finishing Story Board

Gambar
A. Tujuan Menyelesaikan story board untuk project animasi branding komunitas Animasi B. Dasar Teori x Apa itu story board ? Storyboard adalah visualisasi ide dari aplikasi yang akan dibangun, sehingga dapat memberikan gambaran dari aplikasi yang akan dihasilkan. Storyboard dapat dikatakan juga visual script yang akan dijadikan outline dari sebuah proyek, ditampilkan shot by shot yang biasa disebut dengan istilah scene. Storyboard sekarang lebih banyak digunakan untuk membuat kerangka pembuatan website dan proyek media interaktif lainnya seperti iklan, film pendek, games, media pembelajaran interaktif ketika dalam tahap perancangan /desain. Apakah story board itu penting dalam proses pembuatan film atau karya animasi? Penting. Karena banyak keuntungan yang dapat diperoleh dengan menggunakan storyboard. Salah satu keuntungan menggunakan Storyboard adalah dapat membuat pengguna untuk mengalami perubahan dalam alur cerita untuk memicu reaksi atau ketertarika...
Baca selengkapnya

Prak 04 - Rangkuman Materi Design Thinking

Gambar
A. Tujuan 1. Mahasiswa mampu mempersiapkan diri dalam menghadapi Tugas Akhir. 2. Mahasiswa dapat menyelesaikan tugas akhir menggunakan prinsip desain thinking . 1.    People centered : dalam metode ini, perlu ditekankan bahwa setiap tindakan yang dilakukan berpusat pad apa yang diinginkan dan dibutuhkan oleh user 2.    Highly creative : dalam menggunakan metode ini, dapat digunakan kreativitas sebebasnya, tidak perlu aturan yang terlalu kaku dan baku 3.    Hands on : proses desain memerlukan percobaan langsung oleh tim desain, bukan hanya pembuatan teori atau sebuah gambaran di kertas 4.     Iterative : proses desain merupakan sebuah proses dengan tahapan-tahapan yang dilakukan berulang-ulang untuk melakukan improvisasi dan menghasilkan sebuah produk atau aplikasi yang baik Proses dengan metode design thinking akan menghasilkan produk yang tidak hanya dapat dijual atau menggunakan teknologi yang paling canggih. Metode ini menggabungkan kebutuh...
Baca selengkapnya

Prak 11 - Membuat Story Board Animatic

Gambar
A. Tujuan Membuat story board animatic untuk project animasi branding komunitas Animasi B. Dasar Teori STORYBOARD ANIMATIC  Storyboard Animatic ini digunakan untuk mengetahui pewaktuan secara realtime.  Sebenarnya bagian ini merupaka draft dari film animasi yang dibuat. Disitu sudah ada dialog, sound FX, narasi, layaknya sebuah film.  namun bedanya adalah gambar dari animatic storyboard adalah gambar still\diam karena materi yang dipakai dari storyboard yang diolah kemudian diproses melalui software editing  seperti adobe premiere adau adobe after effect  lalu dirender berupa out put file movie.  Animatic merupakan prototipe sebelum cerita yang asli dibuat untuk memastikan bahwa cerita sudah sesuai dan waktunya sudah tepat.  Dengan adanya animatic dapat mengurangi kesalahan dan dapat dilakukan perbaikan. C. Alat Laptop D. Bahan Powerpoint E. Tugas Praktikum Membuat Story Board Animatic F. Hasil Praktikum ...
Baca selengkapnya