Hôm nay chúng ta sẽ tìm hiểu một trong những yếu tố thiết kế đơn giản nhất, đó chính là đường line. Chúng ta sẽ cùng xem làm thế nào để vận dụng cũng như những gì nên tránh khi sử dụng đường line.
Thêm một vài đường line đơn giản có thể tạo ra cấu trúc và đồ họa tinh tế và làm giảm bớt sự nhàm chán của thiết kế. Đó là một thủ thuật đơn giản, khi sử dụng hiệu quả, nó có tác dụng như một layout thêm vào giúp hoàn thiện thiết kế của bạn.

Sử dụng đường gạch chân

Chúng ta sẽ bắt đầu với thủ thuật cơ bản nhất trong typography: gạch chân. Gạch chân headline giúp tiêu đề nổi bật và tách biệt rõ ràng giữa header và nội dung. Hãy nhớ rằng những yếu tố này không phải là yếu tố thiết yếu, có thể có hoặc không nhưng không hề rõ ràng, bạn cần quyết định khi nào nên sử dụng để mang lại hiệu quả cho thiết kế và khi nào nó không mang lại tác dụng, tất cả phụ thuộc vào giao diện của bạn.
Học: DesignALine 1 6 Mẹo Thiết Kế với Đường Line
Lưu ý đường line không chỉ có tác dụng phân biệt hai yếu tố mà còn giúp xác định độ rộng của cột.
Một sai sót nhỏ mà tôi gặp phải khi dùng gạch chân là khi bạn có có những ký tự có phần móc dưới dính vào đường line. Không có quy tắc nào nói rằng không được làm điều này nhưng tôi nhận thấy rằng nó gây mất tập trung và làm lệch hướng sự chú ý của người xem.
Học: DesignALine 2 6 Mẹo Thiết Kế với Đường Line
Vì vậy làm thế nào để giải quyết vấn đề này? Lựa chọn đơn giản nhất là tránh dùng đường gạch chân cho các ký tự có phần móc dưới. Thay vào đó, những gì tôi thường làm là vẽ đường gạch chân bằng tay (thay vì nhấn vào nút gạch dưới), và tránh vẽ chạm những ký tự có phần móc dưới.
Học: DesignALine 3 6 Mẹo Thiết Kế với Đường Line
Như bạn có thể thấy trong ví dụ ở trên, nó giúp văn bản trông đẹp hơn ví dụ ban đầu và giúp thiết kế trông trực quan hơn. Nếu bạn không thích làm điều này với chữ “g” cuối cùng, đơn giản là bạn có thể gạch chân như thể chỉ có một ký tự có dấu móc dưới.

Kéo dài đường line

Hãy nhớ rằng gạch chân không cần rộng bằng phần văn bản. Nhưng đôi khi việc kéo dài đường line đến cuối trang sẽ tạo một chút thú vị cho thiết kế.
Học: DesignALine 4 6 Mẹo Thiết Kế với Đường Line
Nếu bạn kéo dài đường gạch chân, hãy sáng tạo một chút với khoảng trống. Bạn có thể thêm vào một số đường nét, bẻ cong đường line hay bất cứ điều gì mà bạn muốn.
Học: DesignALine 5 6 Mẹo Thiết Kế với Đường Line
Designer bên dưới đã mở rộng đường gạch chân và kết thúc bằng một dấu chấm. Nó giúp liên kết với nội dung bên phải và nhưng trông vẫn tinh tế.
Học: DesignALine 10 6 Mẹo Thiết Kế với Đường Line

Phá vỡ đường line

Không nên quá cứng nhắc trong việc sử dụng đường line. Bạn có thể sử dụng dấu gạch ngang, dấu chấm, hình tam giác, ngôi sao hay bất cứ thứ gì có thể tạo ra đường line mà bạn mong muốn và vẫn đạt được mục đích.
Hãy xem các thiết kế này đã sử dụng những dấu chấm như thế nào để tạo line bên trái và bên phải để có một headline rõ ràng. Mặc dù văn bản ở đây được canh giữa, thiết kế trông có vẻ như được canh đều bởi những đường line bên trái và bên phải của cột.
Học: DesignALine 6 6 Mẹo Thiết Kế với Đường Line
Học: DesignALine 7 6 Mẹo Thiết Kế với Đường Line

Line bao quanh chữ

Nếu bạn sử dụng một theme chính thức, việc lặp đi lặp lại gạch chân ở đầu tiêu đề có thể tạo ra cảm giác như phong cách in cũ. Tôi luôn nghĩ đến tiêu đề một tờ báo khi nhìn thấy phong cách này.
Học: DesignALine 8 6 Mẹo Thiết Kế với Đường Line
Nếu bạn muốn một chút thay đổi, hãy thử tách rời các đường line theo những cách khác nhau. Nó cũng tạo ra hiệu ứng chuyển động cho một trang tĩnh.
Học: DesignALine 9 6 Mẹo Thiết Kế với Đường Line

Line dọc

Hầu hết chúng ta đều sử dụng line ngang nhưng line dọc có thể được sử dụng nhằm thêm vào một số đồ họa sáng tạo cho thiết kế. Designer bên dưới đã phóng đại các đường thẳng đứng và thiết kế trở nên thật sự thú vi và đẹp hơn, theme gắn liền với các phần còn lại của trang.
Học: DesignALine 11 6 Mẹo Thiết Kế với Đường Line
Rõ ràng, có một truyền thống trong việc sử dụng line thẳng đứng nhằm tách hai cột nội dung. Nó có thể được sử dụng kết hợp với hình ảnh để bớt những khoảng trống giữa các cột.
Học: DesignALine 13 6 Mẹo Thiết Kế với Đường Line

Line chéo

Nếu bạn thực sự muốn trang của bạn trông độc đáo hơn, hãy để nghiêng nội dung theo đường chéo. Điều này tạo ra một thiết kế thú vị, trẻ trung và phá vỡ những quy tắc cứng nhắc.
Có thể đặt nghiêng phần nội dung một cách ngẫu nhiên nhưng kéo dài đường line giúp nó trông tự nhiên và hiệu quả hơn. Hãy mạnh dạng sáng tạo để những thiết kế của bạn trông đặc biệt hơn.
Học: DesignALine 14 6 Mẹo Thiết Kế với Đường Line
Hiệu ứng đường chéo đặc biệt phù hợp với những thiết kế như trên.

Kết hợp các chi tiết

Tôi sẽ cho bạn thấy nó dễ dàng thực hiện như thế nào. Bạn có thể thêm một hoặc hai line đơn giản cho thiết kế nhưng nó cũng có thể giết chết tính thẩm mỹ của thiết kế nếu không kết hợp đúng cách. Tuy nhiên, sự kết hợp các thủ thuật ở trên có tạo ra một sản phẩm thực sự sắc nét.
Các thiết kế dưới đây của David Fooks sử dụng rất nhiều line. Anh ấy đã kết hợp những đường chấm nét, đường, đường thẳng, đường cong thậm chí là hình kim cương để kết thúc. Nó không nhề gây lộn xộng mà còn khá sang trọng và đẹp.
Học: DesignALine 12 6 Mẹo Thiết Kế với Đường Line
Lời khuyên của tôi là bạn chỉ cần một chút thận trọng. Giống rất nhiều yết tố thiết kế, đường line có thể mang lại hiệu quả tích cực hoặc tiêu cực. Sử dụng một cách hợp lý và luôn chắc chắn rằng việc thêm vào sẽ tạo giá trị cho thiết kế của bạn.

Nguồn cảm hứng

Tham khảo những tác phẩm sử dụng line trong thiết kế web đế tìm ra ý tưởng hoặc cách kết hợp các đường line cho thiết kế tiếp theo của bạn.

CarbonAds

Học: DesignALine 15 6 Mẹo Thiết Kế với Đường Line

For the Record

Học: DesignALine 16 6 Mẹo Thiết Kế với Đường Line

Evan Eckard

Học: DesignALine 17 6 Mẹo Thiết Kế với Đường Line

Cool and the Guide

Học: DesignALine 18 6 Mẹo Thiết Kế với Đường Line

The Pineapple Thief

Học: DesignALine 19 6 Mẹo Thiết Kế với Đường Line

DesignSwap

Học: DesignALine 20 6 Mẹo Thiết Kế với Đường Line

Caravan

Học: DesignALine 21 6 Mẹo Thiết Kế với Đường Line

Kết luận

Mục đích của việc thảo luận là khuyến khích bạn có một cái nhìn tổng thể về sử dụng đường line trong thiết kế và cân nhắc một cách cẩn trọng khi sử dụng chúng để tạo ra một thiết kế đẹp hơn.
Nếu bạn có thiết kế nào đó sử dụng hiệu quả các đường line đơn giản, hãy để lại comment bên dưới với đường link để chúng ta có thể cùng xem. Và bạn cũng có thể cho chúng tôi biết bạn nghĩ gì về những ví dụ ở trên.

Source : http://vnwordpress.com

0 nhận xét:

Đăng nhận xét

 
Top