Hãy đăng ký thành viên để có thể dễ dàng trao đổi, giao lưu và chia sẻ về kiến thức đồ họa.
  1. Hãy đăng ký subscribe kênh Youtube mới của Việt Designer tại địa chỉ: Youtube.com/VietDesignerChannel để theo dõi các video về thiết kế đồ họa. Do trước đó kênh cũ bị Youtube quét không rõ lý do, trong thời gian chờ kháng cáo nếu các bạn thấy video trên diễn đàn bị die không xem được thì có thể vào kênh mới để tìm xem video sơ cua nhé.
    Loại bỏ thông báo

Thiết kế phẳng - đôi điều tâm sự

Chủ đề thuộc danh mục 'Kinh nghiệm / Kiến thức dành cho designer' được đăng bởi ivyiron, 12/6/13.

Lượt xem: 13,062

  1. ivyiron Thành viên cấp 2

    Flat design – thiết kế phẳng đã từng phổ biến nhiều năm trước đây, nay đang trở lại và được thế giới đón nhận khá tốt. Hình ảnh tiêu biểu của thiết kế phẳng chính là Windows 8 – một phong cách thiết kế đơn giản nhưng vẫn có sức hút riêng.

    Với rất nhiều trang web và các thiết kế ứng dụng, icon… sử dụng Flat design – thiết kế phẳng, xu hướng này ngày càng phổ biến khắp mọi nơi. Sự ra đời của Windows 8 với giao diện Metro và thiết kế mới của Google nhấn mạnh vào thiết kế phẳng càng làm cho xu hướng Flat design trở nên “hot” hơn bao giờ hết. IOS7 mới ra của apple cũng áp dụng " thiết kế phẳng" tuy nhiên cá nhân mình đánh giá thiết kế của IOS 7 là một thiết kế khá tệ.
    Thứ nhất có lẽ không cần giải thích quá nhiều Flat design đơn giản như cái tên của nó - Tuy nhiên, thiết kế phẳng không phải hòan toàn không sử dụng hiệu ứng, nó chỉ thiếu những hiệu ứng con người thường thêm vào để tạo ra chiều sâu một cách nhân tạo. Kể cả khi nhiều thiết kế được xếp vào dạng “gần như phẳng”, nhìn chung giao diện của chúng vẫn chứa đựng một vài hiệu ứng.
    [​IMG]
    Nhìn vào thiết kế trên các hiệu ứng đổ bóng vẫn được sử dụng tuy nhiên nó không nhằm tạo độ sâu hay cảm giác như thật lên thiết kế
    Thứ 2 khi đã bắt đầu 1 dự án với thiết kế phẳng hãy quên hết sự trang trí đi, tối giản và đạt được mục đích là điều mà thiết kế phẳng mang lại và cũng là mục tiêu người thiết kế hướng tới

    [​IMG]

    Một thiết kế như trên mình không cho là một thiết kế phẳng hoàn hảo :)
    Thứ 3 Hãy tập trung vào màu sắc. Thiết kế phẳng sử dụng rất nhiều màu sắc sống động. Từ những khối màu, những thanh, những hình dạng được “nhuộm màu” trong các thiết kế phẳng, ta có thể thấy màu sắc chính là yếu tố chủ đạo làm nên thiết kế phẳng. Cân nhắc việc chọn màu sắc sẽ thật sự làm nổi bật thiết kế phẳng. Có thể bao gồm cả màu đen và trắng, nhưng bạn sẽ có thể gây được hiệu ứng mạnh hơn, tốt hơn nếu dùng nhiều màu sắc hơn.
    Có thể là hơi chủ quan nhưng những gam mầu trung tính và có độ trầm nhất định sẽ mang lại cảm giác tốt hơn sự lòe loẹt hay nhạt nhòa mà IO7 mang lại
    [​IMG]
    Hãy nhìn vào thiết kế và màu sắc của giao diện metro win8 hay winmobile

    [​IMG]
    [​IMG]
    Thứ 4 Hãy cân nhắc về Typography. Từ ngữ rất quan trọng – chúng truyền tải thông điệp
    Như mình đã nói bài viết này là đôi điều tâm sự mình nói suy nghĩ hết sức chủ quan thôi. Không quá cầu kỳ hình thức hay giáo điều về một lý thuyết thiết kế nào hết vì sự sáng tạo là yếu tố cao nhất của mọi hình thức thiết kế.
    Tuy nhiên được chia sẻ một vài kinh nghiệm là điều mình mong muốn. Lại nói về vấn đề cá nhân, mình rất kết phong cách phẳng của win8 và đặc biệt là của Google.
    Cùng phân tích những icon và thiết kế của Google ta sẽ thấy rất rõ những đặc điểm của " thiết kế phẳng"
    Phương pháp thiết kế : Phương pháp khử
    Hãy tối giản mọi chị tiết, chuyển tải thứ ta cần chuyển tại và chỉ vậy thôi



    [​IMG]
    Sử dụng hình khối

    Sử dụng những hình khối, đừng dùng những đường line hay những cung hình sin uốn lượn
    [​IMG]
    Màu sắc

    [​IMG]
    Pixel
    Một thiết kế icon thì pixel là yếu tố được quan tâm nhất. Icon cần gắn kết chính xác với lưới pixel điều này đảm bảo icon sẽ hiển thị sắc nét với kích thước nhỏ.
    [​IMG]
    Nghía qua các thiết kế icon của Google hangout
    [​IMG]

    [​IMG]
    [​IMG]

    ...
  2. toanlove371

    toanlove371 Thành viên cấp 3

    Hơi bị thích mấy thiết kế của Google, nhìn đã con mắt :D
  3. hth02x1

    hth02x1 Thành viên cấp 4

    chủ quan mình dùng ios7 rồi thì thấy rất dễ chịu với giao diện mới, lúc đầu trông có vẻ ko hấp dẫn nhưng dùng vài lần tự dưng thấy rất dễ chịu :)) nó có cảm giác gì như là rất gẫn gũi. còn nhìn qua thì khó đánh giá khi chưa thực sự trải nghiệm vì việc sử dụng giao diện là lâu dài. Dùng ios7 xong nhìn mấy cái của window và google lại ko thấy thích, dù nói về đẹp thì nó hơn hẳn. Nhưng có lẽ sự khác biệt ở apple là cảm giác khi dùng chứ ko chỉ phải là cái nhìn bề ngoài. Đó ko biết có phải là mục đích apple nhắm tới ko vì mình nghĩ đơn giản, nơi tập trung những bộ óc xuất chúng về cả công nghệ, thiết kế và chiến lược như vậy ko thể tạo ra một thứ quá tệ đến mức như vậy nếu theo đánh giá ban đầu. Chí ít thì nó cũng có thể tạo ra sự ngang bằng với window và gg vì bắt chước style như vậy mình nghĩ với các nhà thiết kế ko có gì khó khăn
    Góa Vợivyiron thích bài viết này.
  4. ivyiron

    ivyiron Thành viên cấp 2

    Như mình đã nói bài này là viết theo suy nghĩ chủ quan của mình, chỉ dựa trên đánh giá về thiết kế phẳng :D Một thiết kế đẹp nhưng kém thân thiện với người dùng thì vẫn là một thiết kế tồi, một thiết kế không thật sự tốt nhưng tạo cảm giác thân thiện thì đôi khi vẫn tuyệt :D
    Còn việc có thân thiện hay không thì lại do mỗi người tự đánh giá. Mình chỉ nhận xét IOS7 trên góc độ thiết kế phẳng của hệ điều hành này mà thôi ^^
    hth02x1 thích bài viết này
  5. hth02x1

    hth02x1 Thành viên cấp 4

    mình cũng biết thế nên nói nó về khía cạnh người sử dụng hehe còn về thiết kế thẩm mỹ đơn thuần thì mình công nhận là nó xấu hơn hẳn thật :))
    ivyiron thích bài viết này
  6. hallowilicious

    hallowilicious Memoirs

    Quả nhiên là "phẳng" của iOS 7 là k tốt. Phẳng của google theo hướng minimalistic vẫn là chuẩn nhất.
    Còn cử Windows thì mình đợi bản 8.1 thoai :D
    ivyiron thích bài viết này
  7. Tuiphuong

    Tuiphuong Thành viên cấp 1

    khi kiểu thiết kế không phẳng đã được ưa chuộng và quen thuộc thì tồn tại mãi sẽ chán, sự thay đổi này làm cho cách nhìn phong phú hơn, mình thấy chấp nhận đc và từ từ thích.
    ivyiron thích bài viết này
  8. Đặng Sơn Tùng

    Đặng Sơn Tùng Thành viên cấp 2

    Nói 1 cách cá nhân khách quan dưới 1 người mới nhìn IOS7 qua ảnh thì thật sự news design này nhìn ... thật sự không đẹp lắm từ màu sắc cho đến icon :( thấy bộ cũ đẹp hơn.
    ivyiron thích bài viết này
  9. hallowilicious

    hallowilicious Memoirs

    Đặng Sơn Tùng : bộ cũ nhìn nhiều nhàm mắt mất rồi :D
    Bộ mới nhìn lướt qua cũng k hẳn là k đẹp nhưng mà mình thấy càng nhìn nó càng xấu :( Màu mè lòe loẹt quá, trông mất hết dáng sang trọng, trông như đồ chơi của hello kitty vậy...
    Hi vọng khi mà người dùng được cập nhật chính thức thì sẽ được tùy chỉnh lại, hoặc là đến lúc đó đã có jb rồi
  10. HSP

    HSP Thành viên cấp 4

    có ai đã dùng qua iOS7 ?
  11. hth02x1

    hth02x1 Thành viên cấp 4

    HSP e dùng qua rồi đây, càng dùng càng thích :)) nhìn qua ảnh thì lòe loẹt nhưng mà kết hợp với màn của iphone thì nhìn thanh thoát lắm
  12. iViperious

    iViperious Thành viên cấp 3

    Cá nhân mình thấy ban đầu khi người ta nhắc tới Flat Design " Thiết kế phẳng " và mốt số bài viết tại sao thiết kế phẳng lên ngôi và rồi xu hướng Skeuomorphic dần tụt hậu , người viết đưa ra cả ối lí do để dìm xu hướng cũ xuống rồi nâng xu hướng mới lên với cũng cả ối thứ mà chả biết sau này 1 xu hướng mới ra đời cái ối thứ đấy có lại trở thành sự kím nén sự sáng tạo hay không .

    Có ai nói tới chuyện dù nó đẹp là vậy nhưng cả trăm cả nghìn cái ứng dụng thì may ra được mấy cái thật đẹp giống như Google đã làm . Tuy là "Đẹp" nhưng Flat Design thật sự rất khó tính khó cả về thiết kế lẫn sự cảm nhận ...

    Hãy thử làm 1 ứng dụng thông qua viêc lấy ý tưởng từ iCon của Google bạn sẽ thấy nó khó thế nào (chắc tại cá nhân mình kém cỏi) ^^!

    Skeuomorphic - iMusic Download
    [​IMG]

    Flat - iMusic Download
    [​IMG]

    Đôi dòng tâm hự góp vui với các thím.
    ivyiron thích bài viết này
  13. hth02x1

    hth02x1 Thành viên cấp 4

    e vote cho cái dưới, sau khi dùng ios7 rồi thì e vote ngay cho cái dưới, đơn giản, thân thiện và nhìn thanh thoát, nhìn cái trên cảm giác phức tạp và mệt mỏi quá
  14. HSP

    HSP Thành viên cấp 4

    Có ai đã thử tải bản beta của iost7 trên cellphoneS để update cho máy và tự trải nghiệm
    Mình là 1 ifans . vài ngày nay xem trên các diễn đàn thông tin công nghệ thì ai cũng nói ios7 xấu gay lòe loẹt hay đại loại là chỉ dành cho các bé . . . nhưng thực sự đã ai sử dụng nó trải nghiệm nó ?
    [​IMG]

    GAY Ư , đứng trên phương diện người biết dùng PS tôi thấy apple khá hay khi đặt lớp bờ lu trên hình nền , và hình nền thì có thể tùy chinh đc bạn thích nó đen thì để cái hình nền đen , thích nó đỏ cứ quăng hình màu đỏ . . . .
    cái đáng đê chê là chê các bạn bị nhạy cảm thị giác khi họ kết hợp giữa 1 chiếc ip trắng và nền lên màu rất nổi , và chỉ dùng ké máy của 1 người bạn thôi chứ chưa dám up cái ipod lên để phá vì sợ TEO :)) thì ios7 chưa thật sự phẳng và có nhiều cái khá là mất chất như " sì lai tu un lóc ", giống như 2D - 3D thì ios7 chỉ nằm trong 2.6D thôi cần thời gian để người dùng trải nghiệm phản hồi và sửa chữa vì ?. Không có thiết kế hoàn hảo
  15. ZuoV

    ZuoV Thành viên cấp 1

    Dưới góc độ trung lập, mình xin đưa 1 số ý kiến như sau:

    ivyiron Như bạn đã nói, thiết kế phẳng là thiết kế hướng tới người dùng, nên việc bạn nhận xét là chỉ nói về phần thiết kế phẳng mà bỏ qua thân thiện hay không cũng không hoàn toàn đúng!
    Có thể là trải nghiệm sẽ tốt, chúng mình chưa có điều kiện xài thì nên nhận xét cẩn thận 1 chút!

    HSP Thực sự thì bạn ivyiron chỉ tâm sự về mặt thiết kế phẳng của iOS7, chứ không phải là tranh cãi là iOS7 đẹp hay là không!

    Nên mình nghĩ bạn nên thừa nhận là iOS7 không đẹp hoàn hảo về mảng thiết kế phẳng (nhấn mạnh). Bạn nhận là dân thiết kế thì cũng có thể thấy điều đó. Cái này thì rõ ràng Google và Win8 làm tốt hơn.
    Còn nếu nhận xét trên mặt thiết kế tốt hay không thì mình chưa xài nên không dám phán bừa :)

    Mình không thích giọng điệu của bạn có tính kích động, chê bai nhiều khác (nhạy cảm thị giác, không dám up...) Trải nghiệm cá nhân là quyền tự do của mỗi người.

    Chúng mình thảo luận trên phương diện khách quan, nên nhìn nhận khách quan sẽ tốt hơn, đừng để tình yêu ảnh hưởng :)
    Nguyễn Diễm ThanhMinh Thiện Nguyễn thích bài viết này.
  16. khoiuehb

    khoiuehb Thành viên cấp 1

    bài viết rất hữu ích, thanks :)
  17. Nguyễn Tôm

    Nguyễn Tôm Thành viên cấp 3

    kiếm bản beta ios 7 ở đâu zậy mấy bác chỉ em vs
  18. iViperious

    iViperious Thành viên cấp 3

    iOS 7 về giao diện bên trong các ứng dụng khá ổn (bản thân mình đã xài thử nên có ngu kiến như vậy) so với winphone hay google gì đó thì chả thua đâu (thậm chí còn có cảm giác chút gì đó khác biết có lẽ do layout mỗi HDH nó khác nhau ^^!) . cơ bản là ngay cái màn hình Home + các iCon nhìn loè loẹt các icon Home của iOS chưa hẳn đã là Flat 100% đâu nhé , vẫn xài các hiệu ứng radian cho background của các icon.

    Còn về Background của iOS7 (Apple có đặt thêm 1 lớp blur) giữa các lớp . cái này thực ra nhìn 1 số ứng dụng ví dụ Music thì có vẻ rất đẹp và mượt mà nhưng khi thiết kế thì cái này cũng là 1 cái khiến Design gặp nhiều khó khăn trong việc thể hiện ... nói chung rất là này nọ :D

    Khách hàng của mình (người nhật) mặc dù họ muốn thiết kế theo Flat Design nhưng họ cũng vẫn yêu cầu sử dụng các hiệu ứng thông dụng bên Skeuomorphic nhằm tạo chiều sâu cho App ( đôi điều tâm hự )

    Mình Demo 1 tấm để rõ quan điểm :) ( bức này mình làm demo thôi nhé không nằm trong dự án nào của mình cả )

    [​IMG]
  19. minh_khuyen_da_xoa

    minh_khuyen_da_xoa Thành viên cấp 2

    mình thì thấy bản iOS 7 mới thì đúng là lòe loẹt thật, nhìn chói cả mắt, nếu thiết kế màu với độ sậm như WP thì tuyệt :)
  20. Nguyễn Tôm

    Nguyễn Tôm Thành viên cấp 3

    lòe loẹt thì chấp nhận đc nhưng ức chế nhất vẫn là cái icon la bàn vs icon chứng khoán như 2 cái lỗ đen giữa màn hình, khi nào update về xài nhất định phải bỏ ngay 2 cái đấy vào fordel ẩn đi.
    p/s: Mà sao cái icon photo vs icon Game Center giống nhau thế nhỉ
Từ khóa:

Ủng hộ diễn đàn