<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0" xmlns:cc="http://cyber.law.harvard.edu/rss/creativeCommonsRssModule.html">
    <channel>
        <title><![CDATA[Stories by Sena Bayu on Medium]]></title>
        <description><![CDATA[Stories by Sena Bayu on Medium]]></description>
        <link>https://medium.com/@senanugsxx?source=rss-b65e8fa33562------2</link>
        <image>
            <url>https://cdn-images-1.medium.com/fit/c/150/150/0*saEidUr2nqpLjzBt</url>
            <title>Stories by Sena Bayu on Medium</title>
            <link>https://medium.com/@senanugsxx?source=rss-b65e8fa33562------2</link>
        </image>
        <generator>Medium</generator>
        <lastBuildDate>Sun, 24 May 2026 02:28:57 GMT</lastBuildDate>
        <atom:link href="https://medium.com/@senanugsxx/feed" rel="self" type="application/rss+xml"/>
        <webMaster><![CDATA[yourfriends@medium.com]]></webMaster>
        <atom:link href="http://medium.superfeedr.com" rel="hub"/>
        <item>
            <title><![CDATA[UI/UX]]></title>
            <link>https://medium.com/@senanugsxx/ui-ux-be2d33c60b79?source=rss-b65e8fa33562------2</link>
            <guid isPermaLink="false">https://medium.com/p/be2d33c60b79</guid>
            <dc:creator><![CDATA[Sena Bayu]]></dc:creator>
            <pubDate>Sun, 28 Nov 2021 15:45:59 GMT</pubDate>
            <atom:updated>2021-11-30T12:33:06.000Z</atom:updated>
            <content:encoded><![CDATA[<h3>UI/UX Case Study — Krealogi, Pengembangan Fitur CRM (Customer Relationship Management)</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/635/1*nt1BSIr5202NXHyB4HVs4g.jpeg" /></figure><blockquote>Sebelumnya saya akan melakukan disclaimer terlebih dahulu. Projek ini merupakan bagian dari pelatihan UI/UX bersama skilvul yang sudah bekerjasama dengan Krealogi dari perusahaan Du Anyam yang merupakan salah satu dari sekian banyaknya challange partner yang ada. Saya tidak bekerja ataupun dikontrak secara profesional oleh Krealogi ataupun perusahaan Du Anyam.</blockquote><p><strong>Intro</strong><br>Halo semua perkenalkan nama saya Sena Bayu, saya merupakan peserta SVI ( Skilvul Virtual Internship ) dari program MSIB ( Magang dan Studi Independen Bersertifikat ) dan saya merupakan mahasiswa jurusan sistem informasi di salah satu perguruan tinggi swasta di Bekasi. pada tulisan saya kali ini saya akan membuat sebuah case study dari salah satu produk perusahaan Du Anyam yaitu Krealogi.</p><p><strong>Overview <br></strong>Krealogi merupakan sebuah aplikasi dari perusahaan Du Anyam yang bergerak untuk membantu pemilik UMKM dalam mencatatkan segala kebutuhan mereka mulai dari manajemen data, pemesanan, produksi, bahan baku hingga pengiriman.</p><p><strong>Objective Goals<br></strong>Mencari tahu tingkat kegunaan, kemudahan, kebutuhan &amp; efektivitas, keberhasilan serta kepuasan dari product atau solusi ide, yakni CRM yang ditawarkan pada alur proses.</p><p><strong>Role Team</strong><br>Pengerjaan projek ini dilakukan oleh 3 orang termasuk saya, dalam pengerjaan projek ini kami memiliki tugas dan tanggung jawab yang sama meliputi :</p><ul><li>Melakukan riset.</li><li>Memaparkan ide dan solusi.</li><li>Kontribusi dalam design baik low maupung high fidelity.</li><li>Pembuatan User Stimulus Research serta Usability Testing.</li></ul><p><strong>Design Process</strong></p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*vOp24SNRa973yImeELogrQ.png" /></figure><p>Pada projek ini kami menggunakan design thinking sebagai acuan kami dalam tahap pengerjaan. Karena metode ini lebih mengacu pada pendekatan pengguna sehingga nantinya kami dapat membuat ide dan solusi baru pada projek kali ini.</p><ul><li><strong>Emphatize</strong><br>Pada tahap ini saya melakukan research guna mencari tahu apa yang user butuhkan, pada tahap ini kami fokus pada kriteria user sebagai berikut :</li></ul><ol><li>Usia 20–50 tahun</li><li>Pekerjaan sebagai pengusaha/pengrajin/pemilik bisnis/pelaku UMKM</li><li>Domisili Pulau Jawa, Indonesia</li><li>Memiliki kemampuan berkomunikasi yang baik</li><li>Dapat berbahasa Indonesia dengan baik.</li><li>Memiliki pengetahuan mengenai teknologi yang baik</li><li>Cukup sering menggunakan <em>gadget smartphone </em>untuk kegiatan sehari-hari.</li><li>Cukup sering menggunakan <em>mobile software </em>dalam menjalankan bisnisnya.</li><li>User memiliki <em>device</em> laptop untuk menjalankan figma.</li></ol><ul><li><strong>Define<br></strong>Pada tahap ini kami mendefinisikan masalah-masalah dan apa saja yang dibutuhkan oleh user dari tahap emphatize yang sudah dilakukan sebelumnya dan dituangkan ke dalam sebuah <em>pain points</em>, <em>affinity diagram</em> serta <em>how might we</em>.</li></ul><p>Pertama kami mencari paint points dari sistem yang lama terlebih dahulu. Pada pain points ini kami menemukan beberapa masalah sebagai berikut :</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/941/1*Vi2OyWCDQciC6Zrvg6asmA.png" /></figure><p>Setelah kami menemuka paint pointsnya barulah kami lanjut ke tahap selanjutnya yaitu affinity diagram dimana dalam tahap ini kami mengkategorikan paint points yang ada.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*ZKLHT8HU1yaw5x01vlmyKA.png" /></figure><p>Disini kami membaginya menjadi 7 kategori dimana ada kategori perihal data, broadcast, customer report, business contact, feedback, communication serta logistic.</p><p>Selanjutnya kami masuk ke tahap how might we dimana pada tahap ini kami mencari solusi dari masalah yang sudah di sebutkan dan dikategorikan pada affinity diagram dan pain points.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*4J0877su-PncliqEESAm2w.png" /></figure><ul><li><strong>Ideate<br></strong>Setelah itu barulah kami masuk ke tahap ideate dimana pada tahap ini kami memprioritaskan fitur yang akan kami kembangkan terlebih dahulu dari banyaknya masalah dan solusi yang ada serta membuat desain UI baik low maupun high fidelitynya. Setelah berdiskusi panjang akhirnya kami menentukan beberapa ide yang diprioritaskan untuk dikembangkan terlebih dahulu dan berikut beberapa ide tersebut :</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/900/1*jp7xoCV5Fy8OYh-zx5jDAg.png" /></figure><p>Disini kami memprioritaskan pembuatan fitur input data klien, fitur kartu nama, fitur broadcast, fitur laporan analisis serta upgrade dari fitur pemesanan. Setelah sudah memprioritaskan fitur yang akan dikembangkan kami mencoba untuk membuat flow dan low fidelity dari ide-ide tersebut dan berikut beberapa flow dan low fidelitynya :</p><p>Yang pertama ada input pendataan klien, fitur ini ditujukan untuk menyimpan data diri dari calon pembeli maupun vendor dari UMKM tersebut.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*iKyEyqXi_k_RUXqvz6_HMA.png" /><figcaption>Flow dan Low Fidelity Pendataan Klien</figcaption></figure><p>Yang kedua ada kartu nama, ini berfungsi untuk menyerbar luaskan kartu nama yang berisikan nama toko dan owner UMKM agar bisa memperluas penjualan serta jaringan mereka.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*ze6oGMljfGClNvPfDcDVXQ.png" /><figcaption>Flow dan Low Fideluty Kartu Nama</figcaption></figure><p>Yang ketiga ada fitur broadcast atau komunikasi dimana pada fitur ini nantinya krealogi dapat terintegrasi dengan Whatsapp sehingga mempermudah penjual dalam menjangkau para pembeli dan vendornya.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*BRrQPYYJi8o3arQhQ2pK9g.png" /><figcaption>Flow dan Low Fidelity Komunikasi</figcaption></figure><p>Yang keempat ada fitur laporan untuk klien dimana pada fitur ini penjual dapat melihat performa dari pelanggan yang mereka punya.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/768/1*52DJIMb3tG7OyZus4bjT8g.png" /><figcaption>Flow dan Low Fidelity Laporan Klien</figcaption></figure><p>Yang kelima ada sedikit upgrade pada sistem pemesanan yang lama sehingga menjadi sebuah sistem yang baru dimana ada penambahan dalam pemilihan klien sesuai dengan yang sudah di input sebelumnya.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*Oi5ThStmWBKq3_MR9grJow.png" /><figcaption>Flow dan Low Fidelity Pencatatan Pemesanan</figcaption></figure><p>Setelah semua flow dan low fidelity sudah selesai dibuat barulah kami mempersiapkan UI style guide untuk projek kali ini mulai dari komponen-komponen yang akan digunakan seperti style text, color pallete, icon serta komponen-komponen yang dibutuhkan seperti button, field, dll. Berikut UI style guide nya :</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/794/1*YA_ahNYmin_9Yae7mCi7Gw.png" /></figure><p>Lanjut ke tahap selanjutnya yaitu tahap desain UI dimana pada tahap ini kami memperindah low fidelity yang sudah kami buat sebelumnya menjadi high fidelity atau desain yang sudah lebih cantik. Berikut high fidelity dari beberapa fitur yang kami buat :</p><h3>Input Data Klien</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*dPbb18wz1VmfkcAfWkOBhQ.png" /><figcaption>High Fidelity Input Data Klien</figcaption></figure><h3>Kartu Nama</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*9V6wmXaD4XSmX4MAmF_7UQ.png" /><figcaption>High Fidelity kartu Nama</figcaption></figure><h3>Broadcast/Komunikasi</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/931/1*m8vjK5E9rHETspaG-AjEQA.png" /><figcaption>High Fidelity Komunikasi</figcaption></figure><h3>Laporan Klien</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/901/1*kaIvSBnpMmrBKFpRM3DSJA.png" /><figcaption>High Fidelity Laporan Klien</figcaption></figure><h3>Pencatatan Pemesanan</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*aC5jmYyBO4p0XRm_PpUF7Q.png" /><figcaption>High Fidelity Pencatatan Pemesanan</figcaption></figure><ul><li><strong>Prototype<br></strong>Pada tahap ini kami membuat prototype dari high fidelity yang sudah kami buat sebelumnya, tujuan dibuatnya prototype ini adalah sebagai uji coba untuk tahap selanjutnya yaitu testing dikarenakan sebuah prototype bukanlah objek yang sudah jadi hanya saja sebagai objek yang mendekati aslinya agar nantinya objek tersebut dapat di revisi (jika ada sebuah feedback ) sebelum menjadi sebuah objek yang sudah final. Berikut prototype dari high fidelitynya :</li></ul><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.figma.com%2Fembed%3Fembed_host%3Doembed%26url%3Dhttps%3A%2F%2Fwww.figma.com%2Fproto%2FR2kFxPdmPXOhwjlTIm6lOX%2F%255BKELOMPOK-7%255D---SVI---UIX-%255B18%255D%3Fpage-id%3D42%253A1000%26node-id%3D272%253A5065%26viewport%3D241%252C48%252C0.69%26scaling%3Dscale-down%26starting-point-node-id%3D119%253A2095%26show-proto-sidebar%3D1&amp;display_name=Figma&amp;url=https%3A%2F%2Fwww.figma.com%2Fproto%2FR2kFxPdmPXOhwjlTIm6lOX%2F%255BKELOMPOK-7%255D---SVI---UIX-%255B18%255D%3Fpage-id%3D42%253A1000%26node-id%3D272%253A5065%26viewport%3D241%252C48%252C0.69%26scaling%3Dscale-down%26starting-point-node-id%3D119%253A2095%26show-proto-sidebar%3D1&amp;image=https%3A%2F%2Fapi-cdn.figma.com%2Fresize%2Fthumbnails%2F492c81ab-9f6e-4047-b32e-ce7617ea1c7a%3Fheight%3D450%26bucket%3Dfigma-alpha&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=figma" width="800" height="450" frameborder="0" scrolling="no"><a href="https://medium.com/media/7a0f409c97d9595545b273aa685acdfd/href">https://medium.com/media/7a0f409c97d9595545b273aa685acdfd/href</a></iframe><ul><li><strong>Testing</strong><br>Pada tahap ini kami melakukan testing kepada seorang responden dengan cara meminta responden melakukan uji coba terhadap prototype yang sudah dibuat, pada tahap ini kami menggunakan metode SEQ (Single Ease Question) yang dimana cara pengujiannya adalah dengan membuat responden melakukan aktivitas ke beberapa fitur yang sudah di buat lalu menanyakan nilai dengan skala 1–7 kepada responden pada masing-masing fitur tersebut serta meminta feedback yang dirasakan oleh responden pada saat sedang melakukan uji coba prototype. Tahap uji coba ini dilakukan oleh seorang responden bernama Nursapti (24) merupakan owner dari Apron Bakery yang bergerak di bidang UMKM kuliner yaitu Bakery atau roti dan sejenisnya.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*fpypNqkLJRUkECuNLIY9xQ.jpeg" /><figcaption>Uji Coba Prototype Bersama Responden</figcaption></figure><p>Dari uji coba yang dilakukan bersama responden kami mendapatkan pengalaman dan feedback yang baik dari responden sehingga feedback tersebut dapat menjadi koreksi bagi kami dalam desain UI Krealogi yang sedang di kerjakan kali ini dan berikut beberapat iterasi dari feedback responden yang sudah kami kaji kembali :</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*u4NN7mnwuECgXZf1kzDeAg.png" /><figcaption>Iterasi Pencatatan Pesanan</figcaption></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*mJ_qpMirYQScPvTpC_HS8g.png" /><figcaption>Iterasi Komunikasi</figcaption></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*ZT9kH65HjwWm95pU7Z0uVQ.png" /><figcaption>Iterasi Kartu Nama</figcaption></figure><p><strong>Kesimpulan<br></strong>Membuat sebuah desain UI memanglah tidak semudah yang anda bayangkan, banyak proses serta evaluasi yang harus dilalui agar desain UI yang dibuat menjadi lebih baik dan lebih baik lagi. Pengalaman ini akan menjadi sebuah pengalaman yang berharga baik untuk saya maupun teman-teman saya agar kami dapat menjadi UI/UX designer yang lebih baik kedepannya. Semoga tulisan ini dapat memperluas lagi pandangan anda terhadap UI/UX dan terima kasih telah membaca sampai akhir.</p><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=be2d33c60b79" width="1" height="1" alt="">]]></content:encoded>
        </item>
    </channel>
</rss>