Membuat Animasi Kanan

Submitted by wahono on Rab, 10/07/2015 - 12:32

Pembuatan animasi kanan berfungsi untuk menbuat animasi bagian kanan, animasi yang dapat di tampilkan berupa gambar, teks, video dan HTML. Kita dapat memilih salah satu dari pilihan tersebut, atau kombinasi dari gambar, teks, video dan HTML.

  • Klik menu grup yang sebelumnya sudah dibuat (jika belum ada, buat grup terlebih dahulu)
  • Pada menu Grup klik tombol Sunting Animasi
  • Setelah itu klik tombol Tambah Animasi kanan
  • Isi judul animasi
  • Pilih grup untuk animasi tersebut
  • Animation code berfungsi sebagai hasil akhir dari animasi yang kita buat, dan juga berfungsi untuk memasukkan code yang telah jadi dari desain yang telah kita buat.
  • Klik Konten Animasi dan dilanjutkan klik AcoSlider Editor (seperti gambar)
    Acoslider
  • Pratayang Acoslider berfungsi untuk menampilkan animasi yang baru di ubah, dengan mengeklik tombol [TERAPKAN PERUBAHAN] sehingga jika ada kesalahan dapat langsung di benahi.
  • Konfigurasi container, berfungsi untuk pengaturan ukuran sebagai berikut:
    • Lebar (pixel), untuk mengatur berapa pixel lebar layar yang akan di tampilkannya animasi kanan.
    • Tinggi (pixel), untuk mengatur berapa pixel tinggi layar yang akan di tampilkannya animasi kanan
    • Checkbox [Lebar Penuh], jika aktif maka animasi yang tampil akan memenuhi container yang telah di setting lebar dan tingginya (disarankan). jika tidak animasi yang tampil sesuai dengan ukuran aslinya.
    • Checkbox [Putar Otomatis], jika aktif maka animasi akan memutar/memainkan secara otomatis (disarankan), jika tidak untuk memutarnya menggunakan klik kanan pada mouse.
    • Checkbox [Widget], jika aktif maka akan tampil widget sehingga kita dapat memberhentikan animasi yang sedang berjalan.
  • Setelah itu konfigurasi slide dengan cara klik "slide 0", untuk animasi kanan hanya beberapa konfigurasi yang harus di setting, konfigurasi-konfigurai yang harus disetting sebagai berikut:
    • Lama (detik), berfungsi untuk mengatur waktu lamanya animasi ini akan tampil. 
    • Jenis latar belakang, berfungsi untuk menagtur latar belakan animasi kanan, ada tiga pilihan untuk jenis latar belakang.
      • Latar warna, dimana untuk latar belakang terdiri dari bermacam-macam warna yang dapat kita pilih di combo box [Warna Belakang].
      • Latar Motif, dimana untuk latar belakang terdiri dari beberapa motif yang telah kami sediakan yang dapat kita pilih di combo box [Motif].
      • Latar gambar, dimana untuk latar belakang terdiri dari gambar yang kita inginkan.
        • [Telusuri] berfungsi untuk memilih gambar yang akan ditampilkan, setelah memilih gambar, maka secara otomatis [URL Gambar] akan terisi.
        • [Pengulangan Gambar], berfungsi untuk mengatur gambar tersebut akan mengulangi gambar berdasarkan:
          • [No Repeat]
          • [Repeat X]
          • [Repeat Y]
        • [Ukuran Gambar], untuk mengatur gambar berdasarkan
          • [None]
          • [Contain]
          • [Cover]
        • [Perataan], berfungsi untuk mengatur gambar tersebut dapat rata kanan/rata kiri/rata kanan tengah dan lain-lainnya.
    • Efek Masuk. berfungsi untuk mengatur efek dimulainya animasi, dimana untuk efek masuk ini banyak pilihan yang dapat dipilih sesuai yang diinginkan.
    • Efek Keluar. berfungsi untuk mengatur efek keluarnya animasi, dimana untuk efek keluar ini banyak pilihan yang dapat dipilih sesuai yang diinginkan.
    • Icon [+] berfungsi untuk menambah slide, sehingga di Animasi kanan kita dapat menampilkan beberapa slide.
    • Icon [-] berfungsi untuk menghapus slide yang tidak akan digunakan lagi.
  • Item Slide, berfungsi untuk mengatur isi dari slide yang akan dibuat, terdiri dari:
    • [Jenis Elemen] berfungsi untuk memilih animasi yang akan tampil terdiri dari:
      • [Text], animasi yang berjalan berupa teks, dimana dalam teks ini dapat diatur:
        • checkbox [tebal] untuk menebalkan teks yang tampil
        • checkbox [miring] untuk untuk memiringkan teks
        • checkbox [garis bawah] untuk memberi garis bawah pada teks.
        • [Jenis Font] berfungsi untuk memilih font pada teks, dimana jenis font ini telah kami sediakan, jenis font ini terdiri dari font bawaan acosinfo dan juga font yang diambil dari google font.
        • [ukuran huruf] berfungsi untuk mengatur besar kecilnya huruf.
        • [Warna huruf] berfungsi untuk memilih warna huruf.
        • [Efek teks] berfungsi untuk memilih efek dari teks.
        • [Perataan Vertikal] dan [Perataan Horisontal] berfungsi untuk meratakan teks.
      • [Image], animasi yag berjalan berupa gambar.
        • [URL Gambar] untuk memilih gambar
        • [Pengulangan Gambar]
        • [Ukuran Gambar]
        • [Perataan]
        • [Transparan (0-1)], berfungsi untuk mengatur transparan teks tersebut, jika kita isi 0.5 maka gambar tersebut akan transfaran 0.5.
      • [Video], animasi yang berjalan berupa video.
        • [Jenis video] berfungsi untuk memilih jenis video yang akan ditampilkan.
        • [URL Gambar] untuk memilih lokasi video
        • [Lebar (px/em/%)] berfungsi untuk mengatur lebarnya ukuran video yang tampil.
        • [Tinggi (px/em/%)] berfungsi untuk mengatur tingginya ukuran video yang tampil.
      • [HTML], animasi yang tampil diambil dari link website.
    • [Posisi & ukuran] berfungsi untuk mengatur posisi dan ukuran animasi yang akan ditampilkan, terdiri [Kiri (px/em/%)], [kanan (px/em/%)], [Lebar (px/em/%)] dan [Tinggi (px/%)].
    • [Kontainer], untuk menatur kontainer yang terdiri dari
      • [Warna belakang], berfungsi untuk memilih warna belakan dari item slide
      • [Lebar bingkai (px)], berfungsi untuk mengatur tebal tidaknya bingkai (garis tepi)
      • [warna bingkai], berfungsi untuk memilih warna bingkai
      • [Lengkung (px/em/%)], berfungsi untuk membuta garis lengkung pada bingkai
      • [Tipe Bingkai], berfungsi untuk memilih tipe bingkai yang telah disediakan.
      • [Bayangan], berfungsi untuk memilih tipe bayangan yang telah disediakan.
    • [Animasi Masuk] berfungsi untuk mengatur animasi item slide pada saat diawal
      • [Efek] berfungsi untuk memilih efek saat animasi masuk.
      • [Mulai (detik)] berfungsi untuk mengatur waktu mulainya efek saat masuk, satuan yang digunakan detik.
      • [Lama (detik)] berfungsi untuk mengatur waktu lamanya efek saat masuk.
      • [Pengulangan] berfungsi untuk memilih waktu mengulangnya.
    • [Animasi Normal] berfungsi untuk mengatur efek, mulai, lama dan mengulang, setelah efek animasi masuk.
    • [Animasi Keluar] berfungsi untuk mengatur efek, mulai, lama dan mengulang, setelah efek animasi normal.
  • Tombol [Tinjauan] berfungsi untuk melihat Animasi kanan yang telah dibuat sebelum disimpan.
  • Tombol [Save and keep published] berfungsi untuk menyimpan Animasi kanan yang telah dibuat.
  • Tombol [Hapus] berfungsi untuk menghapus Animasi kanan yang telah dibuka.