NGHIÊN CỨU TRƯỜNG HỢP UI / UX: ỨNG DỤNG CỦA CỬA HÀNG CÀ PHÊ

Apr 09 2022
Giới thiệu Xin chào! Đây là bài viết đầu tiên của tôi trên Medium. Lần này tôi sẽ chia sẻ một câu chuyện về một ứng dụng quán cà phê mà tôi đã tạo ra.

Giới thiệu

Xin chào! Đây là bài viết đầu tiên của tôi trên Medium. Lần này tôi sẽ chia sẻ một câu chuyện về một ứng dụng quán cà phê mà tôi đã tạo ra. Dự án này là kết quả của một thử thách được đưa ra khi tôi tham gia Nghiên cứu độc lập với tư cách là Nhà thiết kế UI / UX tại Học viện Binar. Chương trình Du học Độc lập này được tổ chức bởi KEMENRISTEKDIKTI được rất nhiều sinh viên từ khắp Indonesia theo học, chương trình này bắt đầu từ tháng 2 đến tháng 7 năm 2022.

Lý lịch

Cà phê là một trong những thức uống phổ biến nhất trên thế giới. Hương vị đặc trưng và hương thơm thơm ngon hấp dẫn của nó đã thu hút rất nhiều người đến thưởng thức cà phê. Bản thân ở Indonesia có rất nhiều loại cà phê mang đặc trưng riêng, ít nhất có một số loại cà phê từ Indonesia có thể vang danh khắp thế giới như cà phê Aceh Gayo, cà phê Toraja, cà phê Kintamani Bali và nhiều loại khác nữa.

Cùng với sự phát triển của nó, cà phê trở nên phổ biến hơn. Sự xuất hiện của một quán cà phê hiện đại mà chúng ta thường gọi là quán cà phê và được hỗ trợ bởi sự phát triển và lan truyền rất nhanh của mạng xã hội là một trong những yếu tố khiến cà phê ngày càng trở nên phổ biến. Nhưng những phát triển này có thể gây ra vấn đề, chẳng hạn như vấn đề xếp hàng. Nhân dịp này tác giả sẽ cố gắng giải quyết vấn đề xếp hàng bằng cách làm một ứng dụng chống xếp hàng cho quán cà phê.

Bàn nghiên cứu

Nghiên cứu tại bàn là một phương pháp nghiên cứu có thể được thực hiện tại bàn làm việc hoặc tại nhà của bạn. Nghiên cứu tại bàn được thực hiện bằng cách thu thập dữ liệu rải rác trên internet, dữ liệu thu thập được có thể ở dạng tạp chí, bài báo, bài đăng trên mạng xã hội, cho đến các bình luận trên mạng xã hội. Tôi sử dụng phương pháp nghiên cứu tại bàn vì tôi nghĩ rằng phương pháp này hiệu quả nhất khi chúng ta muốn làm một dự án đơn giản vì chúng ta không cần nhiều thời gian và tiền bạc để làm và nó có thể được thực hiện ngay tại bàn làm việc.

Thu thập dữ liệu

Dữ liệu này được lấy từ một số bài báo và bài đăng trên mạng xã hội liên quan đến các quán cà phê và hàng đợi.

Thu thập dữ liệu

Sơ đồ mối quan hệ

Từ kết quả của chương dữ liệu, Insight được tạo ra dưới dạng một sơ đồ thần tính.

Sơ đồ sở thích

Nhiệm vụ thiết kế

Nhiệm vụ thiết kế là một phác thảo sơ bộ về các tính năng mà chúng ta sẽ tạo ra trong ứng dụng nói chung. Từ kết quả của sơ đồ Affinity, các nhiệm vụ thiết kế được đưa ra dưới dạng một cái nhìn tổng quan về những tính năng nào sẽ được tạo trong ứng dụng. Nhiệm vụ thiết kế mà tôi thiết kế như sau:

Chủ đề ứng dụng

Ứng dụng sẽ được thực hiện là một ứng dụng có chủ đề quán cà phê nhằm mục đích giúp người dùng mua cà phê dễ dàng hơn mà không phải xếp hàng.

Nền tảng

Nền tảng di động là nền tảng được sử dụng rộng rãi nhất hiện nay, do đó để làm ứng dụng này tôi sử dụng nền tảng di động, vì sử dụng nền tảng di động trở nên hiệu quả hơn.

Các tính năng chính

  • Đăng nhập / Đăng ký
  • Danh mục
  • Chi tiết Menu
  • Đặt hàng tùy chỉnh
  • Chi tiết hóa đơn
  • Xếp hạng
  • Thông báo đặt hàng
  • Đặt hàng từ xa
  • Tùy chọn thanh toán không dùng tiền mặt
  • Trò chơi nhỏ và Đa phương tiện

Việc tạo nhân vật người dùng nhằm mục đích mô tả kiểu người dùng sẽ sử dụng ứng dụng của chúng tôi. Trong tính cách người dùng được tạo, có một số điểm quan trọng bao gồm lý lịch của người dùng, mục tiêu của người dùng, sự thất vọng mà người dùng trải qua, những thách thức tự nhiên của người dùng, động lực của người dùng và thái độ của người dùng. Tính cách người dùng cũng được sử dụng để giúp dễ dàng xác định các vấn đề mà người dùng gặp phải.

Người dùng Persona

Bản đồ hành trình của người dùng

Bản đồ hành trình của người dùng là bản đồ về hành trình của người dùng để đạt được các mục tiêu nhất định trong một trường hợp. Hành trình người dùng được thực hiện lần này là hành trình của người dùng khi anh ta muốn mua cà phê tại một quán cà phê.

Bản đồ hành trình của người dùng

Wireframes và Wireflow

Khung dây

Tôi đã tạo khung dây này để cung cấp cái nhìn tổng quan về thiết kế khi sau này phát triển độ trung thực cao

Khung dây

Wireflow

Luồng dây này được tạo ra để giúp chúng tôi xác định luồng ứng dụng dễ dàng hơn khi thiết kế nguyên mẫu.

Luồng đăng nhập
đăng ký lưu lượng
Quy trình đặt hàng
Luồng trò chơi

Bảng tâm trạng

Làm một bảng tâm trạng theo ý kiến ​​của tôi là một trong những điều quan trọng, bởi vì bằng cách làm một bảng tâm trạng, chúng ta sẽ nhận được rất nhiều cảm hứng từ thiết kế, màu sắc và nhiều hơn nữa. Bảng tâm trạng mà tôi thực hiện lần này được lấy từ một số tài liệu tham khảo mà tôi có trên trang web dribbble.

Hệ thống thiết kế

Thiết kế hệ thống là điểm chuẩn được sử dụng để tạo ra thiết kế, trong trường hợp này, tôi đã thực hiện một số thiết kế hệ thống để giúp tôi dễ dàng thiết kế Độ trung thực cao của ứng dụng.

Màu sắc

Hệ màu

Kiểu chữ

Hệ thống kiểu chữ

Biểu tượng

Biểu tượng hệ thống

Cái nút

Hệ thống nút

Thẻ

Hệ thống thẻ

Thanh điều hướng

Hệ thống thanh điều hướng

Tìm kiếm

Hệ thống tìm kiếm

Hộp văn bản

Hệ thống hộp văn bản

Khác

Thành phần khác

Độ trung thực cao (Thiết kế giao diện người dùng)

Độ trung thực cao là chế độ xem được phát triển từ wireframe để tạo ra một thiết kế ứng dụng đã đẹp, có màu sắc và các thành phần khác.

Độ trung thực cao

Nguyên mẫu

Nguyên mẫu là kết quả của quá trình phát triển wireflow sử dụng thiết kế giao diện người dùng đã được tạo, nguyên mẫu thiết kế có thể được nhấp vào và hiển thị tương tác với người dùng.

Đóng cửa

Cảm ơn tất cả mọi người đã ủng hộ và giúp đỡ tôi trong quá trình thực hiện thử thách này. Tôi cũng cảm ơn người cố vấn Vhendy Vendira đã hướng dẫn tôi làm việc trong dự án này. Xin lỗi nếu có nhiều sai sót khi làm đồ án, hoặc có điều gì đó chưa phù hợp. Hy vọng rằng dự án này có thể mang lại lợi ích và giúp tất cả chúng ta trong việc phát triển cộng đồng UX ở Indonesia.

© Copyright 2021 - 2023 | vngogo.com | All Rights Reserved