4 bước thiết kế website hoàn hảo

Khi bắt tay vào thiết kế web, bạn đi từ công đoạn A sang B như thế nào? Jason Cianfrone sẽ khái quát các bước tiếp cận tìm ý tưởng của riêng anh khi tiến hành thiết kế website. Chúng ta hãy cùng tìm hiểu là các đó là gì nhé.

Khi bạn dành được công việc đó, bạn sẽ đi gặp khách hàng và ghi chép lại nhiều nhất có thể những yêu cầu của họ. Và tiếp theo sẽ làm gì? Mặc dù các designer web có các bước thiết kế website riêng của mỗi người, nhưng tôi nghĩ mình nên chia sẻ phương pháp tiếp cận riêng của tôi với các bạn. Các bước này không phải là một danh sách liệt kê những gì bạn phải làm khi thiết kế, mà đơn giản chỉ là những phương pháp mà tôi thích. Nó giúp tôi rèn luyện về cảm hứng và đánh giá công việc.


Bước 1. Đánh giá, học hỏi, hiểu

Hãy xem xét các mục tiêu của thiết kế và nghĩ xem làm thế nào để bản thiết kế đạt được những mục tiêu đó.

Trước khi bạn vội vàng ngồi ngay lên máy để thiết kế, sử dụng các phần mềm xây dựng code ưa thích của mình, bạn hãy để đầu óc của mình suy nghĩ theo đúng hướng. “Đúng hướng” theo tôi đó là suy nghĩ ngắn gọn và xem thông điệp của bản thiết kế là gì để hoàn thành các mục tiêu của bạn.
Với những ghi chép trong tay, tôi sẽ nhớ hình dung lại khi gặp khách hàng, tìm kiếm những ý chính và mục tiêu của thiết kế, và nghĩ xem làm thế nào để bản thiết kế đạt được những mục tiêu đó. Cá nhân tôi đã nhận thấy rằng công đoạn này đạt hiệu quả nhất là khi tránh xa màn hình vi tính.

Đưa ra tất cả các giải pháp có thể

Tôi đọc qua những ghi chép của mình và đánh giá những khó khăn, vạch ra những giải pháp có thể cho các mục tiêu đã đề ra. Ví dụ, nếu khách hàng yêu cầu website với cảm giác “bình yên” hoặc “thư giản”, vậy là cần phải tiến hành với màu sắc, thể loại, hình ảnh, bố cục và khoảng trắng. Nếu đối tượng mục tiêu chủ yếu của khách hàng không am hiểu về công nghệ hoặc máy tính, vậy thì chính kinh nghiệm của người dùng, chức năng và những lời kêu gọi hành động lại là những yếu tố tác động đến bản thiết kế. Tôi luôn cố gắng dành nhiều thời gian cần thiết cho công đoạn này và đánh giá càng nhiều càng tốt. Khi tôi cảm thấy hài lòng, tôi sẽ chuyển sang công đoạn tiếp theo.


Bước 2. Thiết kế Wireframe

Thiết kế Wireframe có thể được tiến hành trên máy hoặc vẽ bằng tay trên giấy.

Công đoạn tiếp theo chính là thiết kế Wireframe

Tôi thích vẽ bằng tay trên giấy bởi tôi có thể ghi chép lại những lưu ý về wireframe để sau có thể xem lại. Mặc dù vậy, đôi khi bạn sẽ cần bàn bạc với khách hàng về các wireframe trước khi tiến hành thiết kế, khi đó wireframe nên làm trên máy tính.

Các công cụ thiết kế wireframe

Tôi thường dùng Adobe Illustrator hoặc bất cứ chương trình chỉnh sửa đồ họa nào.  Ngoài ra còn có một số công cụ khác như Balsamiq Mockups hoặc Mock Flow app.
Điều quan trọng bạn cần lưu ý đó là các wireframe không chỉ được vẽ cho các phiên bản trình duyệt của website. Hãy nghĩ đến liên kết chéo thiết bị trong toàn quá trình và hãy xem các yếu tố trên trang sẽ hoạt động như thế nào qua tất cả các thiết bị.


Bước 3. Tìm cảm hứng

Tìm kiếm cảm hứng ngoài màn hình vi tính.

Những ý kiến đánh giá sẽ giúp tôi hiểu rõ hơn về bản thiết kế để tiếp cận với các wireframe. Nhưng trước khi bắt tay vào thiết kế, tôi thích tìm cảm hứng từ rất nhiều nguồn.
Tôi sẽ bắt đầu với việc quan sát các website khác cũng có các mục tiêu tương tự như những gì tôi đã vạch ra. Nếu những gì các bạn thích, tôi không chỉ copy lại mà còn nghĩ cách làm sao để nó có thể được thiết kế tuyệt hơn. Tôi cũng hỏi xem khán giả nguồn của website sẽ phản ứng như thế nào với thiết kế đó?

Thiết kế phù hợp

Các designer thường có cảm hứng với việc tạo ra các tính năng hoặc yếu tố riêng trong bản thiết kế của mình, đơn giản chỉ vì họ thích chúng. Tuy nhiên, bạn đừng nên suy nghĩ về các xu hướng thiết kế hay cố tạo ra cái gì đó mà những designer khác sẽ thích. Mà nó phải có liên quan đến dự án của bạn.

Ý kiến của khách hàng cũng có thể tạo nên các cảm hứng. Ví dụ, nếu tôi đang thiết kế website cho một cửa hàng trang sức, thay vì cứ lên Google và gõ tìm “các website trang sức thiết kế đẹp nhất”, tôi sẽ tìm đến một cửa hàng trang sức nào đó, quan sát thiết kế nội thất cửa hàng và suy nghĩ về cảm giác của mình khi đi vào hoặc cách bày bán sản phẩm của cửa hàng.

Mang theo máy ảnh

Nguồn cảm hứng thường đến từ những nơi không được chờ đợi nhất. Tôi thường tìm thấy cảm hứng khi rời khỏi màn hình máy tính của mình. Thiết kế trong một thế giới thực thường đóng một vai trò vô cùng to lớn; kiến trúc, nghệ thuật, thiết kế sản phẩm, nhiếp ảnh. Ngoài ra, những hình khối, hình dạng, và màu sắc của thiên nhiên luôn cho ta những cảm hứng tuyệt vời. Và chiếc máy ảnh luôn giúp tôi ghi lại nguồn cảm hứng này.


Bước 4. Thiết kế và xây dựng

Nghỉ ngơi là một điều vô cùng cần thiết

Đến lúc này, tôi đã cảm thấy như mình đã biết rõ những gì cho bản thiết kế. Tôi đang tràn ngập cảm hứng và không thể chờ đợi thêm nữa. Tôi thích thiết kế trong âm nhạc; âm nhạc giúp tôi không bị mất tập trung bởi những tác động bên ngoài và thật chú tâm trong thế giới riêng của mình. Tôi để tất cả các ghi chép và wireframe bên cạnh và liên tục xem lại chúng.

Giải lao

Ngoài ra, tôi thường giải lao trong khi thiết kế và thấy rất hữu ích. Cứ chăm chăm vào cái gì đó liên tục trong suốt 8 tiếng đồng hồ sẽ chỉ khiến chúng ta suy nghĩ cứng nhắc theo một hướng mà thôi. Hãy thư giãn và nghĩ về thiết kế khi không ngồi trước màn hình vi tính, điều đó sẽ có thể giúp bạn có những sáng tạo mới. Quan trọng nhất, tôi không bao giờ quên việc mình đang thiết kế cho ai; Nghề của tôi chính là thể hiện theo cách sáng tạo những điều họ cần.

Dịch theo creativebloq | Ban Biên Tập RGB.vn


Trong nỗ lực đem đến nhiều hơn nữa những bài viết chất lượng dành cho độc giả, RGB.vn mong muốn sẽ giới thiệu đến các bạn những bài viết nội dung hay được biên tập kỹ lưỡng và nghiêm túc. Hy vọng các bạn sẽ tiếp tục ủng hộ chúng tôi. Khi trích dẫn lại bài viết xin vui lòng ghi rõ nguồn, link RGB.vn