Các mẹo cho dân thiết kế UI/UX khi thiết kế một trang website

Mặc dù đã trải qua biết bao nhiêu thời đại cho đến nay vẫn giữ nguyên vẹn giá trị của nó. Với những sản phẩm mà sự sống còn dựa trên cảm tình và trải nghiệm của khách hàng như website hay app mobile, thì nội dung trên đích thực có sự ảnh hưởng đến các sản phẩm thiết kế của chúng ta…

Xin chớ nhầm lẫn rằng, đơn giản không phải là đơn điệu, hời hợt và nhàm chán. Thay vào đó, sự đơn giản tinh tế đem đến cho thiết kế những nét cuốn hút rất riêng, giúp nó trở nên trực quan và thực sự hữu ích cho người dùng. Những sản phẩm tối giản không những giải quyết được nhu cầu của người dùng, mà còn giúp người dùng tránh tiêu tốn thời gian vào những thứ rườm rà không cần thiết. Rất hiếm khi ta nghe ai đó đánh giá một sản phẩm kĩ thuật số bằng những cụm từ như yêu thương, trân trọng. Mà sẽ mô tả chúng với các từ ngữ quen thuộc như: đẹp, bắt mắt, bóng bẩy (khi nói về giao diện thiết kế), hay trực quan, dễ dùng, khó thao tác (về tính năng), còn (về nội dung) thì là cung cấp nhiều thông tin hữu ích, có chọn lọc

Hãy trở thành một designer thiết kế trải nghiệm người dùng (UX) có tâm. Vì việc tôn trọng thời gian và công sức của người sử dụng là việc thực sự rất đáng làm, nếu như bạn đang hướng tới nghề thiết kế giao diện (UI). Bài viết này với mục đích gợi ý một số lời khuyên hữu ích về thiết kế giao diện website, giúp người dùng có thể tiết kiệm được thời gian và công sức trong quá trình sử dụng sản phẩm của bạn.

1. Đua các thông tin quan trọng đưa lên Header hoặc trước header

Khi thiết kế website, việc đưa các nội dụng trọng tâm lên header giúp việc nắm bắt thông tin trọng tâm, trở nên dễ dàng và nhanh hơn rất nhiều.

Thế thì bây giờ vấn đề nằm ở chỗ, nội dung nào là trọng tâm, thu hút? Đối với các website chứa số lượng lớn thông tin, như các trang thương mại điện tử (Tiki, Lazada…), tin tức (Kenh14, Zing News, Vnexpress…) thì header như là lời giới thiệu nhanh gọn trong vài giây ngắn ngủi, chúng có nhiệm vụ cung cấp đầy đủ những thông tin thiết yếu để thu hút sự chú ý khách hàng (chương trình khuyến mại, hay tin tức đang hot), trước khi họ lướt xuống xem phần ở bên dưới.

Tham khảo những kiểu nội dung bên dưới mà bạn nên đưa lên header:

  • Những thành phần cơ bản trong bộ nhận dạng thương hiệu: logo, tên thương hiệu, hoạ tiết, hình chụp…
  • Slogan, hình ảnh công ty hoặc tổ chức, màu sắc chủ đạo…
  • Những câu chữ giới thiệu lĩnh vực sản phẩm hay dịch vụ công ty
  • Các liên kết (links) đến các chuyên mục (categories) khác trong website
  • Liên kết đến các trang mạng xã hội (Facebook, Instagram…)
  • Thông tin liên lạc cơ bản (số điện thoại, email, địa chỉ, …)
  • Bảng lựa chọn ngôn ngữ (trường hợp hoạt động đa quốc gia)
  • Ô tìm kiếm
  • Ô đăng kí nhận thông tin quảng cáo, hay tin tức (kiểu như điền email khi có khuyến mãi hay thông báo khi có hàng)
  • Các hành động tương tác với sản phẩm như là đăng kí dùng thử, nút download từ AppStore, Google Play Store

Một lưu ý cực kì quan trọng, bạn không phải cứ tìm mọi chỗ trống để nhồi nhét, lấp đầy tất cả những thứ trên vào thiết kế trừ khi bạn muốn người đọc bị quá tải thông tin khi nhìn vào. Càng nhiều thành phần thu hút sự chú ý, càng khó để người dùng phân biệt thông tin trọng tâm. Các bạn designer sẽ cần phải thảo luận trước với mấy bạn marketer, tìm hiểu kĩ lưỡng xem cần đem cái gì lên header, mà nó mang lại hiệu quả nhất.

 

 

Các nghiên cứu gần đây về sự chuyển động (eye-tracking) của mắt người khi tiếp nhận thông tin, đã chỉ ra một sự thật thú vị: Hầu hết mọi người đều di chuyển mắt theo chiều từ trên xuống. Vì vậy, khi đưa những thông tin quan trọng về thương hiệu lên đầu trang web (tức header), sẽ giúp sản phẩm hay dịch vụ của thương hiệu được truyền tải đến người xem một cách nhanh chóng nhất. Đây là một tuyệt chiêu để làm hình ảnh công ty có cơ hội lưu lại trong tâm trí của người dùng một cách âm thầm. Đối với các bạn có ý định tiến xa hơn trên con đường UI/UX, thì thiết kế header là một kĩ năng mà các bạn cần phải thuần phục.

2. Trải nghiệm người dùng – trải nghiệm thương hiệu phải thật ấn tượng

Trong khuôn khổ bài viết, bộ nhận diện thương hiệu (Brand Identity) được đề cập đến chỉ bao gồm các hình ảnh, yếu tố đồ hoạ với mục đích tạo sự chú ý và nhận biết từ khách hàng về sản phẩm hoặc dịch vụ của công ty trên thị trường. Những hình ảnh của thương hiệu có thể được truyền tải đến khách hàng bằng nhiều giác quan khác nhau, ví dụ như qua thị giác, qua lời nói, ngôn ngữ, hay sự cảm nhận.

Theo các phân tích và nghiên cứu về phân khúc thị trường (target audience), hành vi khách hàng (customer research), ta có thể thấy nhận dạng thương hiệu dường như đóng một vai trò tối quan trọng trong việc quảng bá sản phẩm. Hình ảnh thương hiệu phải được thiết kế làm sao để có thể nhận biết thật nhanh và ghi nhớ dễ dàng.

Trong trường hợp web và mobile, thì bộ nhận diện thương hiệu là những thành phần đồ hoạ miêu tả bề ngoài của công ty như logo, typography, màu sắc, họa tiết…  Những thứ trên khi kết hợp lại, sẽ tạo nên một công cụ cực kì đáng gờm mà mỗi công ty sẽ dùng nó để thương hiệu của mình in sâu đậm trong tâm trí khách hàng. Một website hay app chính chủ được đầu tư bài bản, sẽ khiến người dùng cảm thấy an tâm và tin tưởng hơn rất nhiều.

3. Dùng những con số biết nói để tạo lên ấn tượng

Một khảo sát được đăng tải trên trang Nielsen Norman Blog đã tiết lộ cho chúng ta một thông tin khá thú vị: Lúc đọc các thông tin trên trang web, mọi người thường có xu hướng dừng mắt lại ở những con số (dù là nó đang nằm giữa một rừng chữ). Vì trong tiềm thức, chúng ta đều ngầm hiểu, các con số gắn liền với các sự kiện, thông số, kích cỡ, khoảng cách – những thứ được cho là có lợi ích.

 

Bất kể nó thể hiện cái gì đi nữa, các số liệu sinh động luôn có lợi thế hơn so với những đoạn văn bản dài dòng, khô cứng. Điều này giúp phần nội dung của chúng ta được khách hàng quan tâm hơn, cũng như việc tra cứu thông tin trở nên thuận tiện và dễ dàng.

4. Bố trí và dùng nội dung chuẩn để tiết kiệm thời gian đọc hiểu thông tin

Như ở phần trên có nhắc đến, người đọc hiếm khi nào dành thời gian để xem toàn bộ nội dung của trang web ngay từ đầu, mà họ thường có thói quen lướt sơ qua xem trước, coi có đúng phần thông tin mà họ cần hay muốn xem không. Trang blog Nielsen Norman Group là một nơi tuyệt vời khi cung cấp những kiến thức thiết kế trải nghiệm người dùng (UX), cũng như những nghiên cứu tâm lí về hành vi người dùng.

Đặt các thông tin quan trọng ở những vị trí mà người đọc có cơ hội cao nhìn thấy chúng, bên cạnh đó phân cấp thông tin (visual hierarchy) có chính có phụ sẽ tiết kiệm được rất nhiều thời gian và công sức khi dò tìm thông tin.

5. Nhấn mạnh thông điệp qua các hình ảnh và banner bắt mắt

“Trăm nghe không bằng mắt thấy”, những hình ảnh đẹp đẽ, bắt mắt lúc nào cũng dễ thu hút sự chú ý từ người xem hơn là những dòng chữ khô khan, nhàm chán. Không những truyền tải thông điệp một cách sinh động và trực quan, các hình vẽ minh họa có chất riêng, hay hero banner siêu ngầu, những tấm ảnh chụp thu hút ánh nhìn, sẽ mang lại những lợi ích sau đây:

  • Làm người xem muốn đọc phần nội dung của bạn
  • Người xem cảm thấy dễ hiểu và dễ chịu khi nhìn vào
  • Làm đồng bộ phong cách thiết kế
  • Cho người xem cảm giác vui vẻ và thích thú
  • Sản phẩm hay dịch vụ tạo được thiện cảm đối với khách hàng

6. Kiểm tra tốc độ load trang

Thiết kế của bạn dù có ấn tượng bao nhiêu, lộng lẫy bao nhiêu nhưng tốc độ load trang như rùa bò thì cũng thành ra công cốc. Với nhịp sống ngày càng nhanh như thời nay, những thứ như: hình ảnh, videos, chuyển động… mà bắt người dùng chờ quá lâu thì không ai có đủ thời gian và kiên nhẫn để thưởng thức tác phẩm của bạn hết. Họ sẽ chuyển sang trang khác ngay lập tức đấy!

Vì vậy điều tối quan trọng là nên thường xuyên kiểm trang tốc độ load trang, tính tương thích của app hay website trên nhiều thiết bị, kích cỡ màn hình khác nhau để đảm bảo rằng chúng luôn mang lại một trải nghiệm thống nhất cho khách hàng.

Bài Viết Liên Quan