Thứ Hai, 28 tháng 12, 2015

Tỉ lệ vàng trong thiết kế và cách sử dụng

tumblr_lmy664hfii1qlzfx0o1_1280

Tỷ Lệ vàng và ứng dụng của nó trong thiết kế

Tỷ lệ vàng là gì:
Là tỷ lệ cân đối nhất, với đặc điểm độc đáo là tương quan giữa thành phần nhỏ đối với thành phần lớn cũng bằng tương quan giữa thành phần lớn đối với thành phần tổng cộng, lớn và nhỏ– tức toàn thể và tất cả chỉ có một giá trị tương quan duy nhất = 1,618033987 (Con số vàng) Do nhà toán học tài ba người Ý Fibonacci đề xuất.
Theo công thức toán học nó được tính như sau:01-golden-ratio-ti-le-vang-concept
02-ti-le-vang-thiet-ke
03-fibonacci-golden-rectangle-ti-le-vang04-golden-rectangle-fibonacci-ratio

Tỷ lệ vàng trong Hội Họa và kiến Trúc
Hơn 4000 năm trở lại đây, các nhà Họa Sỹ và các nhà Kiến Trúc Sư đã áp dụng Tỷ lệ vàng trong các bức tranh và tác phẩm thiết kế kiến ​​trúc.
Bức họa nổi tiếng Nàng Mona Lisa  của danh họa Leonardo da Vinci là một minh chứng cho sự chuẩn mực về tỷ lệ.
ty-le-vang-mona-lisa(1)
 Tỷ lệ vàng trên khuôn mặt
ty-le-vang-monalisa
Chúng ta còn thấy tỷ lệ vàng giữa chiều cao từ đỉnh đầu đến cằm và từ cằm đến bàn tay nàng Mona Lisa
Một số tác phẩm kiến trúc được áp dụng tỷ lệ vàng
panthenon
Công trình Parthenon
10-ti-le-vang-thap-rua
Công trình Tháp rùa ở Việt nam
Tỷ Lệ vàng áp dụng trong nhiếp ảnh
bo-cuc-1-phan-3-trong-nhiep-anh_4 (1)
Ảnh chụp chân dung
sunshinecyz2013117133011349_22
Ảnh chụp Phong cảnh
tylevang
Ảnh chân dung kết hợp với hậu cảnh
Tỷ Lệ vàng áp dụng Trong thiết kế Logo
Ngày nay Tỷ Lệ vàng đã được áp dụng rất nhiều trong những tác phẩm thiết kế đồ họa như Web, Logo…
Sau đây chúng ta cùng đi phân tích một số tác phẩm logo nổi tiếng dưới đây được áp dụng Tỷ lệ vàng
Logo Apple
11-ti-le-vang-logo-apple
 Đường kính các vòng tròn tạo ra cấu trúc logo Apple có tỉ lệ theo chuỗi Fibonacci (tỉ lệ vàng)
Apple là một trong số ít các công ty không sử dụng tên thương hiệu trong logo của họ. Mặc dù vậy logo Apple được thiết kế đã trở thành một biểu tượng công ty uy tín trên thế giới. Logo rất cân bằng và những đường biên được tạo ra bởi các vòng tròn có đường kính tuân theo chuỗi Fibonacci. Vậy Rob Janoff (nhà thiết kế logo chuyên nghiệp, người đã tạo ra logo Apple) có cân nhắc đưa chuỗi Fibonacci vào trong thiết kế hay chỉ là sự tình cờ.
Logo Pepsi

12-pepsi logo_golden_ratioHai vòng tròn chính của logo Pepsi có đường kính theo tỉ lệ vàng 1.6.18
Hình logo mới của Pepsi đơn giản hiệu quả hơn. Logo có tính chất thúc giục mọi người và rất đẹp. Nó trông giống như một Emoticon cười (Emotion Icon – Biểu tượng cảm xúc) màu đỏ và màu xanh. Nhưng bạn có biết điều cơ bản nằm sâu bên trong của logo Pepsi là tỉ lệ vàng không? Logo thương hiệu Pepsi được tạo ra bởi việc tổ hợp các hình tròn theo tỉ lệ tương tác với nhau và nó tuân thủ Tỉ lệ vàng.
Logo iCloud
13-icloud logo_golden_ratio
Một sản phẩm khác của Apple cũng có logo rất ấn tượng. Các đường cong tạo ra đám mây cũng có đường kính theo tỉ lệ vàng. Hình chữ nhật bo ngoài logo cũng tuân theo tỉ lệ vàng luôn. Ngoài ra có rất nhiều sản phẩm khác của Apple từ Ipods đến Iphone cũng là những hình chữ nhật vàng .
Logo BP

14-bp logo_golden_ratio

BP là hãng hãng dầu nhờn và gas lớn nhất thế giới. Họ đã trình làng logo mới vào năm 2000. Những gì tạo ra sự thu hút của logo hóa ra lại được tạo thành từ những hình tròn có tỉ lệ theo chuỗi Fibonacci. Sự trùng hợp hay việc thiết kế có ý đồ?

Logo Toyota

15-ti-le-vang-toyota logo_golden_ratio

Logo của Toyota có 3 hình bầu dục. Hai hình elip cắt nhau với ngụ ý về khách hàng và sản phẩm và tầm quan trọng của mối quan hệ đó. Vòng tròn ngoài cùng là thế giới và môi trường kinh doanh toàn cầu. Nếu nhìn kỹ hơn chúng ta có thể thấy lưới tọa độ có tỉ lệ vàng. Lưới tọa độ Phi φ đã tạo ra các tỉ lệ vàng thú vị.
Những ví dụ kể trên là những logo đã áp dụng Tỷ lệ vàng thành công và khéo léo. Trong thực tế ngoài kia, có thể còn có rất nhiều logo như vậy. Và dĩ nhiên cũng còn có vô vàn những logo đẹp khác mà người thiết kế chẳng cần quan tâm đến Tỷ lệ vàng. Giá trị Tỷ lệ vàng có thể khiến logo của bạn trở nên nổi bật và cũng có thể không. Vấn đề là bạn hãy tin tưởng vào sự sáng tạo của mình và có thể ý tưởng của bạn sẽ phá vỡ mọi quy tắc.
Bài viết được tham khảo từ nhiều trang web. Rất cảm ơn các bạn đã đọc bài viết này!
Nguồn: bellex.com.vn

Thứ Ba, 22 tháng 12, 2015

Nghĩ về product, đừng chỉ nghĩ về giao diện

Khi nghĩ về trải nghiệm người dùng, thật sai lầm khi nghĩ rằng mọi thứ chỉ dừng lại ở tính năng và giao diện, và chúng ta có khuynh hướng thiết kế tính năng theo một lối mòn trong requirement. Vấn đề thực tế nằm ở chỗ tính năng chỉ đơn giản là một phần nhỏ của sản phẩm. Chúng chỉ là một số trong rất nhiều giải pháp cho những vấn đề của người dùng liên quan đến sản phẩm. Tư duy sản phẩm cần phải suy nghĩ về những vấn đề cụ thể của người dùng, các công việc phải làm, về mục tiêu và doanh thu.
w704
Cốt lõi của trải nghiệm người dùng không phải là các tính năng, thực tế nó chính là mục đích sử dụng sản phẩm của người dùng. Cốt lõi trải nghiệm người dùng của Uber là có thể dễ dàng bắt một chiếc taxi bất cứ lúc nào. Đếm ngược, hiện thị chính xác thời gian taxi đến, con đường ngắn nhất sẽ là những tính năng phù hợp để tạo ra trải nghiệm này. Có một mối tương quan một chiều giữa tính năng và sản phẩm: tính năng không hoạt động mà không có sản phẩm. Đây là lý do mà designer nên suy nghĩ về sản phẩm trước hết.
Khám phá những công việc mà sản phẩm được sử dụng
Một sản phẩm luôn có một giá trị sử dụng cho người dùng, về cơ bản thì đó là lý do sản phẩm tồn tại. Nó đáp ứng một nhu cầu hoặc giải quyết một vấn đề nào đó của người dùng. Bằng cách đó, nó sẽ trở nên có ý nghĩa và giá trị hơn. Nếu vấn đề không tồn tại, hoặc giải pháp không giải quyết được vấn đề thì sản phẩm sẽ trở nên vô dụng và người dùng sẽ không sử dụng nó, điều đó sẽ dẫn đến sự sụp đổ của sản phẩm. Giải pháp sai lầm có thể sữa chữa nhưng vấn đề không tồn tại thì không thể chỉnh sửa được tất cả. Vậy làm thế nào chúng ta chắc chắn có thể giải quyết một vấn đề? Tuy chúng ta không thể chắc chắn 100% nhưng vẫn có thể giảm thiểu nguy cơ tối đa nhất bằng cách quan sát và nói chuyện với mọi người. Từ đó chúng ta có thể khám phá vấn đề và đưa ra giải pháp mà khách hàng mong đợi
Sau đây là một câu chuyện khá nổi tiếng. Clay Christensen là một ví dụ khi cố gắng cải thiện doanh số bán hàng của sữa lắc. Ông cố gắng tăng vị ngọt của sữa cũng như tạo ra nhiều mùi vị hơn và nhẹ nhàng tăng kích thước của ly kem lên một xíu. Không có gì xảy ra cho đến khi ông quan sát khách hàng của mình. Ông thấy rằng mục đích mua sữa lắc của họ là để làm cho việc lái xe buổi sáng của họ bớt nhàm chán hơn. Lợi ích lớn nhất của sữa lắc là nó có khả năng lấp đầy dạ dày cao hơn những thức uống khác. Nó thực sự là một vấn đề, khách hàng hoàn toàn không có ý tưởng về nó. Christensen đã đưa ra các giải pháp thiết kế cho cốc đựng sữa có thể dễ dàng đặt trong khay đựng vật dụng trong xe hơn, làm cho sữa đặc hơn để kéo dài thời gian uống. Những giải pháp này tạo ra hiệu quả doanh thu không thể ngờ tới.
Hãy suy nghĩ về sản phẩm và xây dựng tính năng phù hợp với người dùng
Suy nghĩ về sản phẩm giúp bạn xây dựng thành công tính năng của nó. Bằng việc xác định các vấn đề cần khắc phục, bạn sẽ trả lời được câu hỏi “tại sao chúng ta phải xây dựng sản phẩm này?” Xác định đối tượng “ những người nào gặp phải vấn đề này?” và xác định các giải pháp “làm sao chúng ta làm điều này?” Sẽ cung cấp những hướng dẫn cần thiết để chúng ta tạo nên tính năng mới. Đưa ra mục tiêu sẽ giúp chúng ta đo lường được sự thành công của tính năng này.
w704 (1)
Giải pháp phù hợp với vấn đề
Sản phẩm trở nên có ý nghĩa khi cung cấp các giải pháp phù hợp với các vấn đề đã được khám phá. Giải pháp này mô tả cách các vấn đề được giải quyết. Vì thế giải pháp phù hợp sẽ định nghĩa giá trị cốt lõi của trải nghiệm người dùng. Các tính năng cụ thể có thể mở rộng trải nghiệm hoặc hỗ trợ cho những cốt lõi của trải nghiệm nhưng không thể thay thế nó. Interaction Designe và Visual Design có thể tạo nên một sản phẩm đẹp, sử dụng dễ dàng, nổi bật hơn các sản phẩm khác mặc dù không tạo nên ý nghĩa cho sản phẩm. Đó chính là lý do vì sao một giải pháp phù hợp rất quan trọng đối với một sản phẩm.
Định nghĩa sản phẩm
Khi nghĩ về sản phẩm, UX designer sẽ có thể trả lời những câu hỏi sau đây đầu tiên: Chúng ta giải quyết những vấn đề nào? (vấn đề của người dùng) Chúng ta thực hiện điều này vì sao? (Đối tượng mục tiêu)  Tại sao chúng ta làm điều này? (Mục đích) Chúng ta làm điều này bằng cách nào (Chiến lược) và chúng ta muốn đạt được những gì? (Kết quả kinh doanh) Tiếp sau đó mới là suy nghĩ về những gì chúng ta đang làm (Tính năng)
w704 (2)
Sức mạnh của suy nghĩ về sản phẩm
Suy nghĩ về sản phẩm cung cấp cho designer lợi thế cho việc xây dựng những tính năng phù hợp với người dùng. Nó giúp chúng ta hiểu trải nghiệm người dùng một cách toàn diện nhất chứ không chỉ như Interaction hoặc Visual Design của tính năng. Nó đảm bảo sẽ giải quyết các vấn đề thực tế của người dùng và giảm nguy cơ của việc xây dựng những tính năng không mong đợi. Nó cung cấp sức mạnh để đưa ra quyết định đúng đắn khi xây dựng tính năng.
“ Xây dựng các tính năng thì dễ nhưng xây dựng các tính năng thích hợp với người dùng mới là một thách thức”
Suy nghĩ về sản phẩm giúp các designer đặt những câu hỏi đúng đắn, xây dựng các tính năng phù hợp và giao tiếp với các bên liên quan một cách hiệu quả hơn. Nó cho phép các designer có thể nói “không” hoặc do dự trước khi đưa thêm tính năng mới. Bất cứ khi nào một tính năng mới được yêu cầu hoặc ai đó có ý tưởng về sản phẩm mới , các designer có thể đặt ra những câu hỏi đúng trước khi vẽ wireframes hoặc bố trí ưa thích. “Liệu nó có phù hợp với sản phẩm?” Liệu nó có đáp ứng nhu cầu thực tế của người dùng?” “Có phải mọi người muốn hoặc cần nó?” Những điều này sẽ giúp cho sản phẩm đạt hiệu quả chất lượng cao nhất.
Kết luận
Suy nghĩ về sản phẩm chắc chắn sẽ giúp cho designer xây dựng những tính năng phù hợp cho người dùng thích hợp, giải quyết các vấn đề thực tế. Nó tạo nên các quyết định đúng đắn và là nền tảng để có được một sản phẩm thành công mà người dùng mong muốn. Suy nghĩ về sản phẩm sẽ tạo nên một mối quan hệ tốt đẹp giữa người quản lý sản phẩm với UX designer và từ đó dẫn đến một sản phẩm hoàn hảo. Đó là lý do vì sao suy nghĩ về sản phẩm trở nên quan trọng hơn trong UX Design.
Nguồn: medium.com

UX/UI là gì ? Người mới nên bắt đầu từ đâu ?



Đây là câu hỏi mình gặp thường xuyên ở các diễn đàn, website chuyên về thiết kế. Tiếp đó là các bài viết giới thiệu dài dòng hoặc những comment của người dùng. Cuối cùng người xem vẫn chưa hiểu được UX/UI là gì ? và UX khác UI chỗ nào.

Hôm nay mình sẽ trình bày ngắn gọn theo ngôn ngữ nói cho các bạn dễ hiểu. Mình chia bài này làm 3 phần: UX là gì, UI là gì, người dùng mới nên bắt đầu từ đâu.

1. UX là gì ?

UX hiểu nôn na là trải nghiệm người dùng, là hành vi của người dùng đối với sản phẩm của mình. Một design cần hiểu hành vi người dùng để thiết kế bố cục của 1 website, 1 app mobile phù hợp. 
Ví dụ: UX cho 1 trang web bán hàng, thì nút đặt hàng được đặt ngay chỗ giá cả, thông tin sản phẩm để người dùng thuận tiện click vào đặt hàng, đó là UX, nếu 1 người lập trình hoặc deisigner không biết gì về UX thì đặt lung tung nút này ở dưới footer hay header của website thì khi người dùng muốn mua hàng cũng không biết nhấn vào đâu. :)

2. UI là gì ?

UI là giao diện người dùng, là cái mà người dùng sẽ nhìn thấy. UI đẹp, thân thiện và dễ sử dụng thì người dùng sẽ thích hơn.

Tóm lại UX/UI cần đi chung với nhau, nếu UI đẹp mà UX khó sử dụng thì coi như sản phẩm không ai xài, ngược lại UX tốt mà UI xấu quá thì người dùng cũng thấy không thân thiện lắm.

3. Người dùng mới nên bắt đầu từ đâu ?

Đây được coi là 1 câu trả lời khó, vì nó còn phụ thuộc vào kiến thức của bạn đang ở đâu. Đây là ý kiến của mình. Mình là 1 lập trình viên nên thiên về UX nhiều hơn UI, nên sẽ nắm bắt UX trước rồi sau đó nhảy qua UI, còn đối với Designer thì thiên về UI hơn.

Hiện nay UX/UI vẫn còn khá mới ở Việt Nam, tài liệu học chủ yếu là tiếng Anh. Dưới đây mình sẽ giới thiệu 4 quyển sách hay về UX/UI. Các bạn tham khảo thêm.

Về công cụ để học UX/UI:

  • Balsamiq Mockups 3
  • Axure
  • Photoshop
  • công cụ vẽ luồng chạy, phân tích luồng chạy UX (có thể sử dụng Visio Office)
  • Power Point để trình bày sản phẩm UX của mình.
  • Giấy, bút để vẽ tay phát thảo các ý tưởng.

Download tài liệu

Download Tool

 
/*Share Social*/