In order to fulfill the basic functions of our service, the user hereby agrees to allow Xiaomi to collect, process and use personal information which shall include but not be limited to written threads, pictures, comments, replies in the Xiaomi Community, and relevant data types listed in Xiaomi's Private Policy. By selecting "Agree", you agree to Xiaomi's Private Policy and Content Policy .
Agree

Teknologi

[Lainnya] Pengen punya OLShop ? Yuks..kita belajar membuat aplikasi android TANPA CODING [bag.3-Tamat]

2021-01-25 14:22:37
964 3


Daftar isi serial thread : (udah ky GOT ada seri nya)

note. Agar dibaca step by step mulai dari thread pertama

Selamat pagi semua.....Yuks mumpung masih pagi dan Saya masih agak senggang waktunya, kita lanjutkan pembelajaran Membuat Aplikasi Android OLSHOP tanpa coding. (Agar sobat membaca mulai dari thread pertama, silahkan klik serial nya di atas).

Yuks..kita buka web Appcreator24 nya dan lakukan Sign in, dan klik nama OLSHOP yang kemarin kita buat.
Oiya..jangan lupa aplikasi yang kemarin kita buat, silahan di install dahulu di hape karena mulai pembahasan hari ini, kita akan banyak melihat tampilan hasil editing langsung dalam aplikasi nya.
Kalau lupa link download nya, silahkan klik Download App dalam menunya.

Hari ini kita masuk ke pembahasan :
**** DESIGN ****
1. Klik tanda + di depan kata Design (Lihat gambar di atas), lalu pilih Colors
  • Silahkan teman2 ubah warna dari tampilan aplikasi OLSHOP nya dari template pada pilihan Style, Kalau mau di custom sesuai keinginan silahkan pilih Custom pada Style.  Jangan lupa klik SAVE lalu teman2 buka aplikasi nya di hape, silahkan lihat bagaimana hasil tampilannya
  • Tips. Untuk awal lebih baik jangan pilih custom karenan nanti ada huruf/text/tampilan yang tidak terbaca (karena warna nya salah pilih) kecuali teman2 sudah paham benar posisi text/icon yang mau di ubah warna nya.

2. Lakukan hal yang sama seperti di atas pada : Font, Menu type, dan menu pilihan lain nya

jangan lupa setelah klik SAVE selalu buka aplikasi nya dan liat perubahannya

**** SECTIION ****
ini adalah menu untuk mengatur posisi letak menu/pilihan/submenu/fitur dan lain pada aplikasi.

  • Di atas adalah isi dari Section, baru ada 1 section yang kita punya yaitu Admin 1, coba sobat buka aplikasi nya dan tampilan nya akan muncul seperti ini saat begitu aplikasi terbuka.

  • Apa kekurangan yang kita lihat dari gambar di atas ? nga bagus kan? masa begitu buka aplikasi langsung masuk chat ke admin ? kan kita jualan..harus nya yang tampil begitu buka aplikasi adalah produk.
  • Sekarang kita akan pindahkan section admin ini ke dalam submenu, kita namakan saja submenu Bantuan, caranya :

  • Klik Create Section


  • Lalu pilih Submenu


Ini adalah tampilan form isian Submenu :
  • Section title, isi dengan Bantuan karena kita ingin submenu ini di layar aplikasi.
  • Sections, klik tombol hijau Add karena Admin 1 akan kita masukan ke dalam submenu ini (jika ingin section lain masuk dalam submenu ini, silahkan di pilih section apa yang akan di masukan ke dalam submenu ini pada list lalu tekan Add)
  • Center menu, pilih YES jika ingin meletakan icon Admin 1 di tengah layar aplikasi atau NO jika ingin di pinggir kiri (silahkan ubah2 lalu liat perubahan nya dalam aplikasi)
  • Number of columns, dalam 1 baris di layar akan di muncul kan berapa icon/grid.
  • Gap between columns, settingan jarak antar icon0icon dalam submenu ini.
  • Load animation, apakah ingin icon tampil dengan menampkan animasi ?
  • Show sections title, apakah icon akan di tampilkan hanya gambar nya saja ? atau ada judul icon nya?
  • Center titles, Judul icon mau di letakan di tengah atau di pinggir
  • Round corners, icon akan tampil dengan sudut lancip atau membulat.
  • Menu structure, Tata letak icon dalam aplikasi
  • pilihan menu lain nya hanya merubah tataletak/tampilan dari icon/submenu, silahkan kalian coba sendiri dan lihat perubahannya di dalam aplikasi
selanjut scrool layar ke bawah lalu klik tanda + di depan Advanced Setting

akan muncul seperti ini :
  • Show in menu:, pilih YES karena submenu ini akan kita tampilkan di layar utama
  • yang lain nya biarkan default aja, atau kalian bisa coba2 nanti
  • Menu icon, pilih icon untuk submenu ini (jelek kalau nga ada icon nya)
  • Setelah itu pilih save, lalu Back

Sekarang kita telah punya 2 section yaitu:  Admin 1 dan Submenu bantuan
Tapi tampilan di aplikasi masih tetap langsung muncul Admin 1, belum ada submenu nya...silahkan kalian klik icon pensil pada section Admin 1

lalu klik tanda + di depan Advance Setting, akan muncul seperti ini :
  • Show in menu, Pilih NO karena kita mau section ini di tampilkan di dalam submenu bukan pada layar utama
  • lalu klik Save

ini tampilan di aplikasi, Si Admin 1 sudah masuk ke dalam submenu bantuan, tidak muncul lagi layar utama.
Demikian cara menambahkan submenu dan memasukan pilihan ke dalam submenu tersebut, silahkan teman2 coba tambahkan pilihan lain atau submenu lain sesuai kebutuhan.


**** OFFICES ****
Ini adalah pengaturan untuk kontak/chat dengan admin atau cabang.
1. List
Ini adalah daftar admin/cabang, dimana pembeli/user dapat melakukan chat dengan admin/cabang nanti nya.
Silahkan di tambahkan jika memiliki admin/cabang lebih dari 1 (pada gambar telah terdaftar 1 admin yang kita input pada settingan awal)

2. Options
  • ini adalah pengturan untuk pembeli/user aplikasi, apakah kalian ingin mereka mendaftar dulu sebelum bisa chat dengan admin atau Don't Ask jika boleh sebagai anonim.

3. Colors, merubah layar tampilan pada menu admin
4. Conversation, disini lah letak semua chat dari user/pembeli kepada admin.  Pada menu pula admin akan membalas semua chat dari user/pembeli

**** PRODUCTS ****
Section ini paling penting, karena kita menjual produk otomatis kita harus meng-input produk-produk yang akan kita jual
Saya akan mulai dari section Categories karena saya ingin produk yang kita jual di kelompok kan ke dalam kategori sehingga mempermudah pembeli mencari produk

1. Categories
  • Yang tanda panah adalah Categories yang saya buat, sedangkan
  • yang di lingkari adalah Sub Categories
  • Silahkan teman-teman tambahkan seperti contoh di atas

2. Management
Ini adalah form untuk kita menambahkan produk-produk yang akan kita jual, klik New Product
  • Silahkan teman2 isi sesuai dengan produk yang akan di jual, lalu ulangi meng-input produk beberapa item supaya terlihat perbedaannya di aplikasi nanti
  • di bawah ini contoh produk yang sudah saya input

Setelah selesai meng-input produk, kita kembali ke menu Section
  • klik Create Section

  • Pilih Products

  • Isi Section Titiles dengan sepatu
  • Pilih Yes pada Show in menu
  • Pilih gambar icon untuk sepatu
  • Lalu klik save

Kita telah memiliki 3 section/menu dalam aplikasi ini :

Sekarang kita buka aplikasi OLSHOP kita di hape, ini tampilan aplikasi nya di hape saya
  • sudah ada 2 menu..untuk model tampilan menu bisa di ubah2 di Design, Menu type..silahkan kalian coba2 ubah sesuai yang inginkan

Ketika saya pilih submenu sepatu ini yang muncul


dan kalau di klik icon kaca pembesar (merah di tengah bawah), ini yang akan muncul List produk yang akan di jual

Demikian cara mudah membuat aplikasi android tanpa coding, kalian bisa explored dengan merubah2 menu/warna/tata letak, dll sesuai keinginan.

Jika ada kesulitan, silahkan komen n sertakan screenshoot nya untuk mempermudah pemahamanan, nanti akan saya bantu.
Semoga bermanfaat buat semua dan semakin sukses jualannya..

Tije mohon pamit, udah siang...lapaaarrr

Nantikan thread berikutnya membahas WepApp OLSHOP

salam.....

2021-01-25 14:22:37
Favorites5 RateRate

Grand Master Bunny

Haimat | from Redmi Note 8 Pro

#1

uh keren, om...
2021-01-26 04:23:40

Wizard Bunny

tiezell | from Redmi Note 5

#2

makasih episode 3 om
2021-01-27 07:56:31

Moderator

TJ-wunata Author | from Redmi Note 5

#3

tiezell
makasih episode 3 om

sama2...semoga bermanfaat ya....
2021-01-27 08:43:25
# No MI Without You #
please sign in to reply.
Sign In Sign Up

TJ-wunata

Moderator

3 Days Check-In
7 Days Check-In
21 Days Check-In
40 Days Check-In
70 Days Check-In
100 Days Check-In
1 Year Check-In
Agustus - 100 Balasan
September - 100 Balasan
Oktober - 100 Balasan
November - 100 Balasan
Throw Back with Mi 2018
Name The Color
App Review
Challenge Photographer
Tebak Nama Android Q
X-Men Favorite Medal
Like
Check in
Reply
Favorites
Ulang Tahun MIUI Ke-9
close up
Answer Mi #1
Answer Mi #2
Gamers Medal
Answer Mi #3
Ulang Tahun Xiaomi ke-10
Answer Mi #4
2 Juta Member Mi Community
4 Tahun Mi Community Indonesia
My Alter Ego
Xiaomi Layak Jadi No 1
Xiaomi 11T Poster

Read moreGet new

Xiaomi Comm APP

Stay updated on Mi Products and MIUI

Copyright©2010-2021 Xiaomi.com, All Rights Reserved
Quick Reply To Top Return to the list