Tips Design

Goals Membantu Product Designer dalam membangun aplikasi/website yang mudah digunakan dan terlihat menarik di mata pengguna, sehingga pengguna jadi lebih nyaman ketika menggunakan dan menghabiskan lebih banyak waktu pada produk tersebut. Responsibilities Mendesain tampilan visual bedasarkan wireframeMembuat prototype sederhanaBekerja sama dengan develop pada tahap slicing Requirements Telah mengerjakan challenge sederhana yang tersedia di bawahSering menggunakan software FigmaSedang tidak bekerja full-time/part-time/freelancerSedang tidak sekolah SMA/SMKJika sedang kuliah maka minimal semester 3Fresh graduate (kuliah) boleh applySudah mengikuti minimal 1 kelas Premium (untuk memastikan bahwa kamu telah terbiasa menggunakan fitur-fitur di website BWA). Benefits Akses seluruh kelas PremiumBelajar hal baru pada sebuah real-world projectUang kompensansi/jajan bulananProgram pelatihan berbayar di luar program BuildWith Angga Challenge Kerjakan visual design (color, typography, layout, etc) pada wireframe yang sudah kami sediakan di bawahGunakan referensi design berikut https://dribbble.com/buildwithangga/collections/5358948-ux-protoSiapkan link projek Figma yang dapat diakses secara publik Wireframe How to Apply Siapkan Resume (CV) & Hasil test (berupa link Figma public ) dengan rapihIsi subject email dengan Magang UI Designer 2022/23Kirim lamaran ke email [email protected] semoga menjadi tercepat dan terbaik Lowongan dibuka pada tanggal 11 September dan ditutup ketika kami sudah mendapatkan beberapa kandidat yang cocok, Kami akan menambahkan informasi CLOSED pada judul loker apabila lowongan magang ini sudah ditutup dan kami sudah mendapatkan kandidat.

Perbandingan Antara Figma dan FigmaJam Hello People With The Spirit Of Learning! 🙌 Pada artikel kali ini, kami akan membahas mengenai perbedaan Figma dan FigmaJam dari segi fungsionalitas, fitur dan juga cara kerjanya. Yuk simak dan kenali perbedaan antara Figma dan FigmaJam! Figma Figma merupakan salah satu aplikasi berbasis web di mana para user/contributor dapat mengubah ide-ide kreatif mereka menjadi sebuah design yang responsif dan interaktif. Design ini bisa diekspresikan melalui beberapa jenis seperti design web, aplikasi, poster, dan lainnya. Bagi UI/UX Designer, Figma biasanya digunakan untuk mendesign tampilan antarmuka (UI) untuk website maupun aplikasi mobile. Dalam Figma ini, kamu bisa berkolaborasi dengan designer lainnya untuk membuat suatu design secara bersama-sama. Ada banyak macam-macam tools di Figma ini yang akan mempermudah kamu saat mendesign, diantaranya: Menambahkan bentuk, gambar, teks, dan layers di KanvasLeft sidebar untuk melihat layer dan assets yang digunakan pada designRight sidebar untuk melihat dan menyesuaikan seperti ukuran, letak, font dan lain nya dari properti designToggle rulers dan pixel grid untuk presisi design agar lebih rapi dan sempurnaMacam-macam plugin untuk mempermudah design, seperti plugin logo, foto, live tracking map, ilustrasi, dan lain nya. source: Figma FigmaJam FigJam adalah alat kolaborasi masa kini yang inovatif untuk brainstorming ide dan solusi kreatif saat pengembangan sebuah aplikasi. Alat dari Figma ini memungkinkan tim untuk kerja sama secara real time, menuangkan ide mereka dengan banyak fitur menyenangkan dan bermanfaat seperti draw, shape, sticky note, stamp dan add text. FigmaJam bisa menjadi opsi yang tepat untuk mempermudah manajemen pekerjaan maupun tugas bersama tim kamu! 🙌😉 source: Figma Nah, apakah kamu sudah pernah menggunakan Figma dan FigmaJam? dan manfaat apa sih yang kamu dapatkan dengan menggunakan kedua tools ini? Silahkan share artikel ini jika bermanfaat untuk kamu ya!🤗 Untuk kamu yang baru mengenal Figma dan FigmaJam serta ingin mempelajari penggunaan kedua tools ini lebih dalam, kamu bisa bergabung di kelas Learn Figma For Beginner dan Mastering FigmaJam: Brainstorming to User Journey BuildWith Angga.

Hello, People With The Spirit Of Learning! Artikel kali ini akan menjelaskan cara bagaimana membuat suatu project baru di Figma, dan siapa saja yang bisa melihat suatu project yang sudah di buat di Figma. Artikel ini cocok sekali untuk kamu pemula yang ingin beralih menggunakan Figma secara individu maupun secara tim. Bagaimana cara membuat project baru di Figma ? Terdapat dua cara dalam membuat suatu project baru di Figma: 1.Membuat Project Baru Melalui The Team Klik New Project pada halaman menu 2.Membuat Project Baru Melalui Left Sidebar Pada cara kedua kamu dapat membuat project baru dengan tim secara spesifik, dimana kamu atau tim dapat melihat project melalui browser file. Klik the team pada bilah sisi kiriKlik (+) untuk membuat project baru By: Figma.com Beri nama pada project dengan nama yang mudah diingat, kamu bisa mengganti nama pada project kamu kapan saja By: Figma.com Untuk tim profesional atau tim organisasi dapat mengatur project dengan merubah izin pengaturan (permissions setting) untuk semua orang (everyone) pada nama tim (team name), dan dapat mengedit serta memilih dengan pilihan melalui: Mengedit: anggota tim dapat mengakses project dengan level izin pada tim. Dapat melihat: anggota tim hanya dapat melihat file project, mesikpun anggota tim memiliki izin untuk edit Khusus Undangan: yang dapat mengakses file dalam project hanya anggota tim atau kolaborator yang kamu undang. By: Figma.com Catatan: Untuk tim pemula hanya dapat membuat project yang dapat diedit, dan anggota tim dapat mengakses project berdasarkan tingkat izin tim mereka. Selanjutnya, klik create project untuk membuat project baruKlik add a description pada halaman project, dan Figma akan menampilan halaman project di file browser. Selanjutnya, pada Figma suatu project dapat dilihat melalui: 👀 View-only project Hanya pemilik atau pembuat suatu project yang dapat mengedit project tersebut. Anggota tim hanya dapat melihat file dalam project, mesikpun anggota tim memiliki izin mengedit. 🔒Invite-only project Project ini tidak tersedia untuk semua anggota tim karena merupakan project khusus yang dimana anggota tim hanya dapat mengakses project khusus undangan jika anggota tim diundang. Project khusus undangan sangat cocok untuk anggota tim dalam membangun suatu desain tim. Nah, itu adalah penjelasan tentang bagaimana cara membuat suatu project baru di Figma. Yuk, segera memulai membuat project baru di Figma, dan menambah portofolio kamu. Semoga artikel ini bermanfaat, semangat! BuildWith Angga.

Hello, People With The Spirit Of Learning! Artikel kali ini cocok untuk kamu yang ingin beralih menggunakan Figma pada browser karena artikel ini akan membahas syarat untuk pengguna Figma pada browser. Sebelumnya, kita perkenalan singkat dulu terkait Figma. Apa itu Figma? Figma merupakan perangkat lunak berbasis browser yang dapat dijalankan di semua sistem desktop, seperti MacOs, Windows, Linux, dan Chrome OS. Figma juga dapat kamu unduh pada aplikasi seluler yang tersedia di perangkat iOS dan Android. Operating Systems Pada sistem operasi, Figma menggunakan WebGL (Web Graphics Library) yang dapat berjalan dengan baik pada browser karena memiliki syarat grafis yang sangat rendah. Persyaratan browser untuk pengguna Figma minimum: Chrome 66+Firefox 78+Safari 13+Microsoft Edge 79+ Catatan: Jika kamu menggunakan Microsoft Edge, kamu harus menonaktifkan strict mode atau mode ketat yang ada di web Figma.com. Sedangkan, persyaratan untuk sistem operasi Figma minimum: Windows 8.1Apple MacOS 10.12 (macOS Sierra) dan versi lebih baruJenis OS Linux apapun yang dapat mengakses browserJenis Chrome OS apapun yang dapat mengakses browser. Catatan: Silahkan kunjungi What’s my Browser untuk mengetahui browser dan versi sistem operasi apa yang kamu gunakan. Graphics Cards (Kartu Grafis) Graphics Cards atau kartu grafis merupakan komponen penting dari perangkat keras pada komputer. Figma tidak membatasi pengguna kartu grafis tertentu, jenis dukungan browser apa pun seperti, Windows, Linux, OS, Safari akan memberikan perbaikan bug apa pun yang terkait dengan WebGL. Kartu Grafis Khusus Biasanya, beberapa laptop baru memiliki kartu grafis khusus, seperti Nvidia atau AMD, dan prosesor grafis terintegrasi, seperti Intel atau AMD. Biasanya, beberapa laptop baru memiliki kartu grafis khusus, seperti Nvidia atau AMD, dan prosesor grafis terintegrasi, seperti Intel atau AMD. Jika kamu memiliki laptop dengan prosesor dual-GPU, kamu dapat memilih untuk menggunakan GPU khusus, ini akan membantu kamu dalam peningkatan kerja di Figma. Informasi untuk kamu pengguna prosesor GPU khusus: 1. MacOs Cari tahu prosesor grafis mana yang digunakan pada MacBook Pro,Mengatur kinerja grafis pada Macbook Pro (menonaktifkan pengalihan otomatis). 2.Windows (Nvidia) Pada panel kontrol Nvidia, atur chrome.exe untuk menggunakan kartu grafis diskrit. 3. Windows (AMD) Pada panel kontrol AMD, atur chrome.exe untuk menggunakan kartu grafis diskrit. Kartu Grafis yang Tidak Didukung Figma Kartu Grafis yang tidak didukung oleh Figma, yaitu Intel HD Graphics 3000 karena GPU memiliki bug yang diketahui dapat menyebabkan gangguan rendering saat menggunakan Figma. Syarat dan Ketentuan Perangkat seluler (Mobile) pada Figma Jika kamu menggunakan mobile atau perangkat seluler pada Figma, kamu hanya dapat mengakses dan melihat dari file Figma. Ketentuan tersebut berlaku untuk pengguna iPad, tablet, atau perangkat seluler, dan juga berlaku pada tablet yang menjalankan OS dekstop lengkap, seperti Microsoft Surface. Selain itu, kamu juga dapat melihat prototipe pada browser seluler dengan membuka tautan pembuatan prototipe di perangkat seluler. Syarat Minimum untuk mengakses file Figma pada browser perangkat seluler: Chrome pada Android (7.0-9.0)Safari di iOS 11.4+ Catatan: Jika kamu ingin menggunakan Figma secara langsung pada perangkat seluler, kami sarankan untuk mengunduh aplikasi seluler Figma yang tersedia di perangkat iOS dan Android. Nah, kamu sudah mengetahui syarat dan ketentuan browser pada Figma. Jika kamu sudah memenuhi syarat yang ada pada artikel, kamu sudah bisa menggunakan Figma pada browser kamu. Semoga artikel ini bermanfaat buat kamu, ya! BuildWith Angga.

Ada beberapa hal yang perlu kamu set-up di browser mu sebelum memulai menggunakan Figma. Pastikan kamu telah menginstal dan mengaktifkan WebGLAtur zoom browser kamu hingga 100%Pastikan juga bahwa browser kamu adalah versi yang terbaru saat iniNonaktifkan fitur swipe kanan/kiri (khusu MacOS)Install Figma Font Helper untuk menggunakan font default/lokal (Buka tab baru) Note: Jika kamu menginstall Aplikasi Figma di Desktop, kamu tidak perlu menggunakan pengaturan konfigurasi ini. Karena pengaturan konfigurasi ini hanya berlaku untuk Figma yang dijalankan di browser. Berikut ini tutorial untuk mengkonfigurasikan Figma di beberapa browser seperti Google, Safari, Mozila Firefox, Microsoft Edge, Mac. 1. GOOGLE Buka Google Chrome dan pergi ke Chrome Settings MacOS: pergi ke Chrome Preferences (Preferensi Chrome) pada menu, atau juga bisa menggunakan shortcuts Command + ,Windows: Buka File > Preferences atau bisa klik elips vertikal yang ada di pojok kanan atas, dan pilih Settings (Pengaturan) Appearance (Tampilan) Di bagian **Appearance (**Tampilan), pastikan zoom halaman kamu sudah diatur ke 100%. Hal ini untuk memastikan file ditampilkan secara akurat pada resolusi yang lebih tinggi. source: Figma Advanced Scroll ke bawah dan klik link Advanced untuk memperbesar halaman pengaturan. Pada bagian System, Enable Use Hardware Acceleration jika ada. Source: Figma Enable WebGL Jika saat ini WebGL tidak diaktifkan, Kamu dapat menuju ke pengaturan Chrome Flags di browser: chrome://flags/ Update daftar ganti rendering software agar diaktifkan. Ini harus di dekat bagian atas list: Source: Figma Atau, Kamu dapat mencari Flags terkait WebGL dan diubah ke enabled. 2. MOZILA FIREFOX Buka Firefox dan buka menu pada pojok kanan atasDengan melakukan step diatas, kamu dapat melihat seberapa level zoom mu. Kamu juga dapat menggunakan icon - (untuk mengecilkan) dan + (untuk memperbesar)Pada menu yang sama, pilih Prefrences untuk opsi yang lain: scroll ke bawah menuju Firefox Updates. Kamu dapat melihat versi terbaru saat ini dan apakah statusnya sudah ter update atau belum: Source: Figma klik Check for Updates untuk cek informasi seputar update an. Jika kamu belum update browser ke versi terbaru, maka akan ada notifikasi peringatan untuk update browser versi terbaru dan Firefox akan secara otomatis me-restart setelah menginstall.Sebaiknya perbarui pengaturan Allow Firefox untuk Automatically Updates (Update Otomatis). SAFARI Safari diupdate secara otomatis oleh macOS setiap ada versi terbaru. Jika ada versi baru macOS yang tersedia, kamu dapat memperbaruinya di komputer secara langsung, yang juga akan meng-update Safari dengan pembaruan yang diperlukan. Buka Figma di SafariBuka Safari > Preferences (Preferensi) pada menu utamaBuka Websites dan klik Page ZoomDi bagian Situs web yang saat ini terbuka, pastikan Figma diatur ke skala100%: Source: Figma Note: Kamu harus menggunakan setidaknya V10.11.1 (El Capitan) jika Anda ingin menggunakan pinch-and-zoom. MICROSOFT EDGE Figma tidak lagi mendukung Internet Explorer: Jelajahi browser yang didukung → Untuk update Microsoft Edge ke versi yang terbaru: Pada menu, pilih Settings > Updates & SecurityPilih Windows Updates di bagian atas daftar lalu Check For UpdatesJika ada pembaruan, mereka akan mulai mengunduh Microsoft Edge dan di re-start secara otomatis. Untuk mengatur default zoom: Pilih Menu di sudut kanan atas jendela.Pilih Settings pada opsi.Pilih Appearance pada menu di kolom kiri.Di bagian Zoom, update pengaturan halaman zoom untuk memilih tingkat zoom default baru. Enhanced Security Untuk menggunakan Figma di Microsoft Edge, Kamu harus memastikan pengaturan Strict Mode dinonaktifkan untuk Figma.com. MAC Jika Kamu menggunakan trackpad di macOS, mungkin kamu perlu menonaktifkan gerakan scroll kiri/kanan. Hal ini akan mencegah jika kamu secara tidak sengaja menutup file Figma, ketika sedang scroll ke kiri dan ke kanan di dalam kanvas. Buka System Preferences dan buka Trackpad settings: Source; Figma Source; Figma Disable opsi Swipe between pages Source: Figma Nah, kita telah belajar bagaimana cara mengkonfigurasikan figma dengan berbagai browser. Semoga artikel ini bermanfaat untuk kamu ya!🙌😉. BuildWith Angga

Hello people with the spirit of learning! Kali ini, kita ingin berbagi informasi menarik seputar update terbaru dari Figma special untuk kalian UI/UX Designer pengguna setia Figma. Simak yuk! 1. Dark Mode Sebagai seorang UI/UX Designer, apakah kamu menyukai bekerja di malam hari? Jika iya, tidakkah kamu merasa tidak nyaman saat melihat interface Figma yang menggunakan warna putih? Saat ini, Figma memiliki fitur Dark Mode sebagai solusi atas permasalahan tersebut. Kamu dapat memilih tema terang maupun gelap, atau membiarkan pengaturan sistem kamu menentukan temanya. Jika tampilan sistem diatur menjadi gelap, maka Figma akan menggunakan tema gelap. Begitupun sebaliknya. Lalu, bagaimana cara mengaturnya? Caranya cukup sederhana, kamu dapat mengubahnya dengan langkah-langkah berikut : Buka file design FigmaBuka Preferensi > TemaPilih opsi dari daftar tema, light atau darkTada! Tema file Figma kamu telah berubah! Fitur ini bersifat device-specific. Artinya, jika kamu menggunakan akun Figma di beberapa perangkat, pengaturan tema dari satu perangkat tidak akan terbawa ke perangkat lain. Bagaimana, sudah siap bekerja di malam hari menggunakan fitur dark mode? 2. Figma and Slack Di era dimana pekerjaan banyak dilakukan secara hybrid, memastikan rekan kerja satu tim tetap update dengan segala perubahan yang ada mungkin sulit untuk dilakukan. Tetapi sekarang, kamu bisa menghubungkan Figma dengan Slack untuk mendapatkan update secara real time. Apa saja manfaatnya? Dengan mengintegrasikan Figma dengan Slack, kamu dapat melakukan beberapa hal di bawah ini: Membuat channel baru yang didedikasikan untuk menerima pemberitahuan pada file khusus proyek.Notifikasi channel tim tentang file yang baru ditambahkan ke proyek atau tim Figma.Kostumisasi channel Slack dengan pembaruan tentang percakapan yang terjadi di file yang relevan. Setelah kamu berhasil mengintegrasikan Figma dengan Slack, setiap anggota workspace Slack dapat menghubungkan akun Figma mereka dan subscribe channel untuk mendapat notifikasi. Menarik bukan? 3. Spotlight Spotlight memungkinkan kamu mengumpulkan kolaborator dalam file untuk mengikuti apa yang sedang kamu lihat pada desain Figma atau papan FigJam. Bagaimana cara menggunakannya? Simple saja, cukup lakukan dua hal berikut : Arahkan kursor ke avatar kamu di toolbar atas file desain FigJam atau Figma.Klik Spotlight me Setelahnya, semua orang yang sedang melihat file tersebut akan diberi tahu bahwa kamu ingin mereka mengikuti apa yang sedang kamu lihat. Kamu juga akan melihat berapa banyak orang dalam file yang mengikuti spotlight kamu. Ohya, untuk menghentikannya, kamu cukup klik Stop dan spotlight pun akan berhenti. 4. Play favorites Pernahkan kalian kebingungan untuk mencari file penting yang berhubungan dengan design yang sedang dikerjakan? Dengan fitur Play Favorites kita bisa menandai favorit pada design atau layer penting dan mengaksesnya dengan cepat dari bilah sisi kiri file browser kalian. Kita bisa mengklik dan menyeret file atau project favorit dan menyusunnya di bar sebelah kiri. Kemudian, Figma akan memberi bintang pada file favorit kamu. Berikut beberapa cara untuk menambahkan file ke tab favorit: Tampilan bergaris Klik logo bintang di sudut kanan bawah layar untuk ditambahkan ke favoritKlik kanan layar lalu pilih Tambahkan ke favorit AndaAtau, klik dan seret layar langsung ke bagian Favorit Tampilan daftar Klik logo bintang di sebelah kiri nama file untuk ditambahkan ke favoritAtau klik kanan nama filenya lalu pilih Add to your favoritesKita juga dapat mengklik dan menyeret file dari daftar ke bagian Favorit File yang tidak disukai Kita juga dapat menghapus file dari Favorit dengan beberapa cara berbeda, yaitu: Di browser file, klik logo bintang di sebelah file yang tidak disukaiDi editor, klik Hapus dari favorit Anda di sebelah nama file 5. Safe and sound Kita sering kali dihadapkan dengan situasi dimana kita ingin berbagi sebuah file secara publik, tapi hanya orang tertentu yang dapat mengaksesnya. Sekarang kita dapat menambahkan kata sandi menggunakan pengaturan berbagi tautan file. Dimana kita bisa mengontrol akses mereka yang tidak mempunyai izin untuk membuka file dengan bantuan fitur Tambahkan perlindungan kata sandi: 1. Buka file dan klik Bagikan2. Perbarui pengaturan viewers ke Siapapun dengan link dan password 3. Masukkan kata sandi di bidang Pilih kata sandi. Tidak ada persyaratan untuk panjang kata sandi atau tipe karakter.4. Klik Simpan. Figma akan menunjukkan kapan kata sandi ditetapkan dan oleh siapa kata sandi itu dibuat.5. Kita dapat memperbarui izin file untuk siapa saja yang mengaksesnya menggunakan tautan dan kata sandi. Pilih dari dapat mengedit sampai hanya dapat melihat prototipe.6. Figma akan memperbarui akses file dan memuat ulang file. Untuk mengakses file lagi, new user perlu memasukkan kata sandi.7. Pilih Salin tautan Bagaimana, dari keseluruhan update terbaru Figma, manakah yang menjadi favoritmu? Nantikan berbagai informasi menarik lainnya seputar UI UX design dan web-development di website kami ya! See you people.

Hello people with the spirit of learning! Memahami bagaimana integrasi CloudHosting adalah hal yang penting bagi seorang WordPress Developer. Mengapa demikian? Yuk langsung saja simak penjelasannya! CloudHosing merupakan jenis web hosting yang menggunakan beberapa server untuk menjalankan website sehingga beban server menjadi lebih seimbang dan lebih stabil. CloudHosting juga memungkinkan kamu memiliki resource yang tidak terbatas. Menarik bukan? Nah, salah satu penyedia web hosting yang telah dipercaya banyak perusahaan besar di Indonesia ialah IDCloudHost. IDCloudHost akan membantumu mengelola website secara fleksibel dengan memastikan server website selalu aktif, aman dari cyber threat, dan tentunya akses konten dari server ke browser pengunjung bisa berjalan efisien berkat bantuan Object Storage. Jika kamu ingin mempelajari lebih lanjut mengenai IDCloudHost dan bagamina cara mengintegrasikannya dengan WordPress, kami memiliki rekomendasi kelasnya khusus untukmu! Mastering Cloud VPS for Website Developer with IDCloudHost Key Points Mempelajari VPS dan Cloud VPSMempelajari Object Storage IS3 dari IDCloudHostMempelajari pengembangan WordPress dengan Cloud VPSMelakukan integrasi WordPress ke Object Storage IS3 IDCloudHost Bersama Mentor Achmad Fauzi, kamu akan belajar konfigurasi server dengan Cloud VPS agar website memiliki skalabilitas dan performa penyimpanan data SSD bisa lebih cepat. Untuk mulai belajar, silahkan bergabung pada kelas dengan klik link dibawah ini ya! https://buildwithangga.com/kelas/mastering-cloud-vps-for-website-developer-with-idcloudhost?thumbnail=8NRtDwUEdB.274&main_leads=searchresult Kamu juga dapat mempelajari hal lain seputar pengembangan website dengan bergabung pada kelas lainnya yang telah kami sediakan. Silahkan kunjungi buildwithangga.com untuk informasi lebih lengkapnya. Semoga bermanfaat dan sukses selalu!

Hello people with the spirit of learning! Apakah kamu ingin membuat website tanpa harus melakukan coding? Tentu saja bisa dengan CMS yang satu ini, WordPress! Sebagai Content Management System, WordPress memungkinkan kamu untuk membuat dan mengelola konten di website dengan mudah melalui fitur yang telah disediakan. Untuk kamu yang ingin belajar menggunakan WordPress, kamu bisa memulainya dengan mengikuti rekomendasi kelas di bawah ini ya! 1. Wordpress.com Website Development Untuk membuat website, kita membutuhkan keahlian coding, design, server, database, dan masih banyak lainnya. Tapi di sini, mentor Angga akan membantumu untuk membuat website tanpa membutuhkan keahlian tersebut. Sudah siap untuk mencoba? Pada kelas ini, kita menggunakan wordpress.com untuk mengelola sebuah website yang dapat diakses oleh siapa saja dengan gratis tanpa proses yang rumit. Ohya, jangan ragu untuk bergabung karena kelas ini sangat beginner friendly dan mudah dipahami. Key Points Mempublikasikan website agar diakses masyarakatMembangun suatu website untuk bisnisMemodifikasi tema pada websiteMemodifikasi tema pada website So, teruntuk kamu yang ingin membuat website dengan cepat dan mudah, cobalah ikuti kelas WordPress gratis kali ini dari BuildWith Angga! https://buildwithangga.com/kelas/wordpresscom-website-development?thumbnail=Ke6cTQXPwT.58&main_leads=searchresult 2. Wordpress.org Website Development Berbeda dengan wordpress.com, wordpress.org memungkinkan kamu untuk melakukan kostumisasi penuh terhadap website. Plugin dan tema yang disediakan pun lebih beragam. Sangat sesuai untuk kamu yang ingin lebih mengeksplorasi tampilan dari website berbasis WordPress. Melalui kelas ini kamu akan diajarkan berbagai hal dari mulai instalasi WordPress, XAMPP, plugin, dan tema. Sangat sesuai untuk kamu yang ingin berkenalan dengan wordpress.org. Key Points Mengenal Content Management SystemBelajar membuat halaman dan artikel pada Wordpress.orgBelajar kustomisasi pada Wordpress.orgBelajar kustomisasi pada Wordpress.org Sudah siap mengeksplorasi tampilan website tanpa coding? Yuk segera bergabung di kelas dan selamat belajar yaa! https://buildwithangga.com/kelas/wordpressorg-website-development?thumbnail=TsRZS5E15F.84&main_leads=searchresult Nah, itu adalah dua rekomendasi kelas WordPress dari BuildWith Angga yang pastinya dapat kamu ikuti tanpa mengeluarkan biaya. Untuk mempelajari WordPress lebih mendalam, kamu bisa memilih kelas yang sesuai kebutuhanmu di buildwithangga.com, semoga bermanfaat dan suskses selalu!

Hello people with the spirit of learning! Tahukah kamu bahwa UI/UX adalah bidang yang luas? Jika diamati secara lebih mendalam, ada berbagai role dalam bidang UI/UX seperti UI Designer, UX Designer, UX Researcher, UX Engineer, UX Writer dan lain sebagainnya. Nah pada kesempatan ini, kami akan memberikan tiga rekomendasi kelas UI/UX berdasarkan role nya sehingga kamu bisa memilih mana yang paling sesuai untukmu. 1. UI Design : Wireframe to Visual Design Jika kamu ingin menjadi seorang UI Designer, kamu bisa mengawalinya dengan bergabung pada kelas ini. Di kelas ini kamu akan mempelajari bagaimana mengubah wireframe ke visual design dengan menggunakan Figma. Kamu juga akan mempelajari bagaimana menentukan hirarki pada konten, membuat moodboard untuk referensi design, dan masih banyak lagi. Menarik bukan? Key Points Import Gambar dan Icon untuk Tampilan UI DesignMengubah Tampilan Wireframe menjadi Visual DesignMenentukan Hirarki Teks pada KontenMembuat Moodboard untuk Referensi Design Ayo segera bergabung di kelas UI Design dengan klik link pendaftaran kelas di bawah ini ya https://buildwithangga.com/kelas/ui-design-wireframe-to-visual-design?thumbnail=FjEfJ0b3GM.61&main_leads=searchresult 2. UX Design : Userflow Pada kelas ini kamu akan memperdalam keahlian UX Design terutama pada bagian User-Flow, di sini kamu akan mengenal apa itu User-Flow dan bagaimana cara mengimplementasikan hal tersebut pada suatu design aplikasi. Sebelum memulai pembelajaran kamu akan diminta untuk mendownload Tools Whimsical. Jangan khawatir, tools ini juga gratis loh. Key Points Mengenal apa itu User-Flow dan ManfaatnyaMengimplementasikan User-Flow pada design aplikasiMenggunakan Whimsical untuk mendesain Flow aplikasiMenggunakan Whimsical untuk mendesain Flow aplikasi Sudah siap untuk mengeksplorasi dunia UX Design? Yuk bergabung pada link berikut untuk segera memulai pembelajaran! https://buildwithangga.com/kelas/ux-design-user-flow?thumbnail=cYPaBIdP1J.83&main_leads=searchresult 3. Learn UX User Persona Ingin terjun ke dunia UI/UX tapi kamu kurang suka dalam membuat visual design? Sudah kenal dengan UX Researcher belum? Role ini bisa jadi sesuai untukmu. UX Researcher adalah seseorang yang bertanggung jawab untuk meenganalisis perilaku dan kebutuhan pengguna. Melalui kelas ini, kamu akan mempelajari cara membuat user persona dan user story board yang merupakan dua hal yang penting dalam UX research. Pasalnya, persona dan story board dapat membantu menciptakan UX yang baik pada suatu aplikasi. Untuk bergabung pada kelas UX User Persona, kamu dapat mengakses link yang sudah kami sediakan. Sampai jumpa di kelas ya! https://buildwithangga.com/kelas/learn-ux-user-persona?thumbnail=Y2qxhXI7TQ.297&main_leads=searchresult Setalah mengetahui beberapa role yang ada di dalam UI/UX, manakah yang paling menarik perhatianmu? Ohya, untuk mempelajari skill yang dibutuhkan role tersebut secara lebih mendalam, kamu bisa melanjutkannya dengan bergabung pada kelas premium yang kami sediakan. Silahkan kunjungi buildwithangga.com untuk informasi lebih lanjut ya!

Hello people with the spirit of learning! Penggunaan illustrator dalam berbagai kebutuhan grafis dapat memudahkan seorang designer grafis untuk menyelesaikan projectnya. Sebagai pemula, berikut kami berikan proses dalam membuat desain burger dengan menggunakan illustrator. Lets Go! Step 1 : Color Palette Gunakan color palette berikut untuk memberikan pewarnaan desain burger yang akan dibuat. Step 2 : New Document Buatlah lembar kerja baru dengan cara "Pilih File > New > Masukkan ukuran artboard 2500 px x 2500 px " Tekan Create. Step 3 : Outline Roti Burger Buatlah bentuk rectangle dengan cara "Pilih icon rectangle dengan menekan "M" > Tekan Shift + Drag di artboard sehingga membentuk kotak"Hilangkan fill dengan menekan "Shift+X", jadi pastikan hanya tinggal stroke atau garis nya saja (Lihat Step 1)Buat kotak bagian atas melengkung dengan menekan "A", seleksi pada titik atas bagian kanan dan kiri kemudian drag ke arah dalam sampai melengkung secara penuh (Step 2).Buat kotak bagian bawah melengkung dengan menekan "A", seleksi pada titik bawah bagian kanan dan kiri kemudian drag ke arah dalam sampai melengkung sedikit (Step 3).Buat persegi panjang dengan menekan "M" dan tempatkan di tengah-tengah objek melengkung (Step 4)Jadikan objek melengkung menjadi 2 bagian, "Pilih kedua objek" kemudian pilih "Pathfinder pada Panel Properties >Minus Front"Buat melengkung bagian tengah objek dengan menekan "A", seleksi pada titik tengah saja dan tarik ke bagian dalam (Step 6) Step 4: Outline, Sayuran, Daging dan Keju 1. Buatlah persegi panjang dengan menekan "M" dan tempatkan dibagian roti bawah (Step 1). Pisahkan garis yang bawah dengan menekan "A" pilih titik kanan dan kiri bagian bawah kemudian pilih Cut path at selected anchor point (Lihat gambar di bawah). 2. Garis bagian bawah yang sudah terpisah, dibuat melengkung dengan "Pilih Effect > Pilih Transform and Distort > Pilih Zig Zag". Masukkan Size dan sesuaikan, Pada bagian Points pilih "Smooth" (Lihat gambar di bawah). 3. Gabungkan garis lengkung dengan persegi panjang dengan menekan "A" kemudian pilih kedua titik, selanjutnya pilih Connect selected end points (Lihat gambar di bawah). 4. Jadikan lengkung disetiap sisinya untuk sayurannya, dengan menekan "A" kemudian memilih titik atas dan titik bawah dan tarik ke bagian dalam sampai melengkung (Lihat gambar di bawah). 5. Memisahkan sayuran dengan roti burger bagian bawah, pilih kedua objek kemudian pilih Shape Builder Tool "Shift+M", arsir bagian perpotongan antara roti dan sayuran (Lihat gambar di bawah). 6. Buatlah kembali persegi panjang dengan menekan "M" dan buat persegi panjang dibagian atas sayuran, kemudian jadikan lengkung dengan memilih salah satu titik sudutnya selanjutnya tarik kebagian dalam (Lihat gambar dibawah). 7. Buatlah dua objek persegi panjang, persegi panjang yang kecil (warna biru) diposisikan pada persegi panjang pertama (warna merah). Kemudian gabungkan keduanya dengan menggunakan Shape Builder Tool "Shift+M" Selanjutnya buat lengkung semua sudutnya. (Lihat gambar di bawah). Step 5 : Colouring Berikan warna pada masing-masing objek, yaitu : Kode warna #EC9F1F untuk rotiKode warna #F5D812untuk kejuKode warna #C0522d untuk daging,Kode warna #55BD53 untuk sayuran, danKode warna #4D0B00 untuk outlinenya Step 6 : Shadow & Highlights 1. Membuat hightlights pada roti burger, pilih roti burger kemudian pilih pada Object selanjutnya pilih Path dan Offset Path. Pada panel Offset Path, silahkan masukan nilai pada kolom Offset. (Lihat gambar di bawah). 2. Buatlah efek sinar pada roti bagian atas, dengan menduplikat objek kemudian potong menggunakan click to minus front (Lihat gambar di bawah). 3. Buatlah efek bayangan pada bagian keju, Pilih objek keju, kemudian copy dan geser ke bawah dan keatas untuk membentuk bayangan pada bagian atas dan bawah. Berikan warna #FFFFFF untuk bayangan atas dan warna #DB6420 untu bayangan bawah (Lihat gambar di bawah). 4. Buatlah efek bayangan pada bagian dagingnya, "copy (Ctrl+C)" bagian daging dan paste (Ctrl+F) pada bagian daging, kemudian geser ke atas untuk bayangan atas dan geser kebawah untuk bayangan bawah. Berikan warna #A04330 pada bayangan dan warna #C2522D pada bagian dagingnya (Lihat gambar di bawah). 5. Buatlah efek bayangan pada bagian sayurannya, "copy (Ctrl+C)" bagian sayuran dan paste (Ctrl+F) pada bagian sayuran, kemudian geser ke atas untuk bayangan atas dan geser kebawah untuk bayangan bawah. Berikan warna #B1D49B pada bayangan bawah dan warna #52964B pada bayangan bawah (Lihat gambar di bawah). Step 7 : Finishing Setelah semua tahapan di buat, sekarang tinggal finishing dengan menambahkan shadow pada bagian bawah burgernya. Buatlah objek elips, Pilih "L" kemudian arahkan elips dibagian bawah burger.Simpan elips dibelakang burger, Klik kanan pada elips, Pilih Arange > Pilih Send to Back.Berikan warna #280501 pada bayangannya. Good Job! Akhirnya telah menyelesaikan desain sederhana dengan membuat objek burger. Buat kalian yang ingin mendalami menjadi seorang desain grafis, Saya sudah buatkan kelas khusus untuk kalian, agar mahir menggunakan Adobe Illustrator mulai dari Basic sampai Advance. Tidak lupa di kelas juga Saya memberikan project grafis yang bisa kalian jadikan portfolio untuk karyamu. Sekian tips kali ini, semoga bermanfaat, dan Semangat Belajar!