Xu hướng thiết kế web lớn 2015 (P.2)

Các giải pháp có thể đạt được những gì mà chúng ta gọi là giao diện mashup: một bố cục gồm nhiều "lớp" mà điều chỉnh các chức năng yêu cầu hoặc nội dung.

5. Thiết kế phẳng

flat dsign thiet ke web

Trang web thông qua Colin và Dewi

Trong ba năm qua, thiết kế web phẳng nhiều lần đã được ca ngợi là "vua" . Nó vẫn làm rất tốt và sẽ tồn tại trong thơiì gian tới - đặc biệt là trong các yếu tố nhỏ hơn như biểu tượng, menu và minh họa.

Không chỉ làm những yếu tố nhìn tốt (cách tốt hơn so với những biểu tượng web 2.0 glossy bao gồm gần như tất cả các trang web của một vài năm trước đây), mà chúng còn dễ dàng với khả năng mở rộng và quản lý được, nhờ vào công nghệ phông chữ biểu tượng. Icomoon.io là một ví dụ về một dịch vụ trực tuyến cho phép tất cả mọi người để tạo phông chữ biểu tượng của riêng mình một cách dễ dàng miễn phí.

lab21s thiet ke web


Lab 21 lượt thiết kế phẳng vào "thiết kế origami".

Nó là đáng chú ý, mặc dù, rằng thiết kế phẳng không phải là luôn luôn bằng phẳng như vậy. Nhà thiết kế thường kết hợp gradient tinh tế, kết cấu và hình ảnh để đạt được "wow" hiệu ứng. Theo ý kiến ​​của chúng tôi, phần tốt nhất của thiết kế phẳng không phải là độ phẳng của mực, nhưng làm thế nào nó sẽ mở ra cho chúng tôi lên đến ẩn dụ hình ảnh sáng tạo.

Thay vì bắt chước các đối tượng với  skeuomorphic  kỹ thuật (trong đó một biểu tượng notepad trông giống như cuộc sống thực notepad bằng giấy và ràng buộc trong da), thiết kế phẳng cố gắng để truyền đạt ý tưởng của một notepad thông qua một tổng hợp, hấp dẫn và thú vị trực quan mà hoạt động tốt trong các kích cỡ khác nhau .

Chúng tôi dự đoán rằng xu hướng này sẽ ngày càng trở nên giống như cắt dán và trộn với phong cách nhìn khác, tương tự như các  HábitatWeb  website đặc trưng trước đó trong bài viết này.

6. Không có hộp hơn

Nhà thiết kế web luôn yêu để cho thấy họ có thể nghĩ rằng bên ngoài của hộp - theo những cách nhiều hơn một. Người ta có thể gọi xu hướng này "Vẽ một hộp và chứng minh bạn có thể phá vỡ nó". Một màn hình chữ nhật là khung cho mỗi thiết kế web (như chúng tôi biết, chúng tôi không có màn hình tròn). Mỗi phần tử HTML của trang là một hình chữ nhật.

Nhưng các nhà thiết kế, giống như hầu hết mọi người, không thích bị ràng buộc. Có 3 chiến lược khác biệt để chứng minh bạn không phải là nô lệ cho hình chữ nhật - và tất cả 3 dường như ngày càng gia tăng.

Tạo bố cục trang như một hình chữ nhật bao giờ tồn tại

circles hexagons iirregular shapes thiet ke web


Đơn làm bằng vòng tròn để điều hướng Instagram ảnh của DAN. Trang web thông qua DAN Paris. 

Cho phép là: hình tròn, hình lục giác, hình dạng bất thường thậm chí hình thoi.

rectangles thiet ke web


Trang web thông qua  Lorenzo Bocchi

Lệch chân trời và bố trí trang web xem trước trong  axonometric  xem trên Lorenzo Bocchi mang lại cảm giác không gian và chuyển động.

z lotu ptaka realism thiet ke web


Website: Rosa (qua Pixelgrade)

Trong khi nhìn vào trang chủ nhà hàng Rosa giác quan của bạn đang bị lừa dối - bạn gần như có thể cảm nhận được mùi thơm của các cookie. Sử dụng một phiên bản hiện đại của thế kỷ cũ  kỹ thuật trompe-l'œil  và bắt chước một máy tính để bàn thực sự bên trong một màn hình. Ví dụ, có một nền bảng bằng gỗ và sau đó đặt tất cả các đối tượng bố trí vào nó.

swiss2 thiet ke web


Trang web thông qua  các hãng hàng không Thụy Sĩ

Cách cuối cùng của bất chấp một hình chữ nhật được đặt người sử dụng bên trong một không gian vô hạn nơi di chuyển, phương tiện bay, chứ không phải là, cũng ... di chuyển.

Hãng hàng không Thụy Sĩ  thách thức hiểu biết của bạn chuyển hướng trang web.Đang xem trang của họ, bạn có thể cảm thấy như thế nào thông thường chúng ta hiểu về không gian tài liệu được. Ở đây, thay vì di chuyển lên hoặc xuống, chúng ta né tránh cách của chúng tôi giữa những đám mây.

7. Gạch

tiles windows8 thiet ke web

Mặt khác, nếu bạn cảm thấy thoải mái với hình chữ nhật, một cách mát mẻ để cấu trúc nội dung của bạn bằng cách tạo ra gạch. Đối với một số lý do gạch trong thiết kế website bán tốt hơn so với  Metro Windows 8 giao diện. Gạch làm việc tốt trong bố trí và đáp ứng, cùng lúc, vẫn là một cách mát mẻ hình thành bố trí ấn tượng.

Nếu gắn bó với gạch trở nên quá nhàm chán, bố cục có thể được đẩy xa hơn với cạnh ngoằn ngoèo bất thường, đẩy đối tượng hoặc đưa các văn bản trên các cạnh.

8. Di chuyển vật dụng

dailybeast s thiet ke web


The Daily Beast  widget chuyển hướng cho thấy vị trí di chuyển trong phạm vi bài viết.

Thử nghiệm với các định hướng đã được sân chơi yêu thích thiết kế web "trong nhiều năm. "Chơi" với điều hướng đạt đỉnh điểm khi các trang web được thiết kế hoàn toàn bằng Flash. Sự suy giảm của Flash mang lại cho chúng menu êm, không có những hình ảnh động hoặc tương tác lập dị.

Nhưng navigations edgier đã được gia tăng một lần nữa, một phần nhờ vào tiềm năng thiết kế web mới và sự kém hiệu quả phát triển của các mô hình điều hướng hiện tại bằng cách sử dụng trên nhiều thiết bị. Điều này được thực hiện dễ dàng hơn nhờ vào việc sử dụng rộng rãi của Java Script thông qua quá trình tiến hóa liên tục của Java (thông qua các khuôn khổ và các plugin) và giải thích phù hợp hơn về CSS hiện đại trên tất cả các trình duyệt quan trọng.

Dưới đây là một vài ví dụ về các thí nghiệm chuyển hướng và xu hướng. Một số ý tưởng đã được sử dụng rộng rãi, trong khi những người khác đang đẩy mạnh các phong bì hướng tới một loại mới của thiết kế web "hiện đại".

Menu dính

less s thiet ke web

Đây là loại thực đơn mở rộng menu con một mục có liên quan như bạn di chuyển. Nó hoạt động tốt trên một máy nhắn tin với rất nhiều nội dung. Các trang hướng dẫn LESS là một trong những thoải mái nhất để sử dụng "bằng tay loại" trang web mà chúng tôi từng gặp. Trang web thông qua Ít CC.

Một Menu Chủ là một loại thực đơn mà vẫn dán mắt vào đầu hoặc cạnh của màn hình trong khi bạn di chuyển. Dù muốn hay không, nó trở thành một tiêu chuẩn cho một máy nhắn tin.

Đôi khi nó được kết hợp với một scrollspy kịch bản để tạo ra một widget hiển thị chính xác vị trí của bạn trên trang. Nó rất hữu ích, đặc biệt là với các menu dài thứ bậc.

Chuyển hướng dính gắn liền với tất cả 4 góc của màn hình

hum 1 thiet ke web

Trang web thông qua Hum

Quang cảnh đường phố loại chuyển hướng

pudelko w pudelku nawigacja thiet ke web

Trang web thông qua Oh Deer Games

Bản đồ Google, đặc biệt là tầm nhìn đường phố, lấy cảm hứng từ các tác giả của Oh Deer Games tạo menu giống như một đi bộ qua đường phố xem Google. Thời gian sẽ trả lời liệu này sẽ trở thành một xu hướng. Để chắc chắn, đây không phải là trang chỉ khám phá hoặc Street View-style của menu hoặc các axonometric "bay qua" quan điểm, tốt hơn được biết đến trong game.

Mà chúng tôi mang đến một xu hướng đáng chú ý ...

9. Tích hợp bản đồ Google

street view inspire thiet ke web

Chúng tôi đánh dấu đây là một xu hướng không chỉ vì nó được tăng lên trong một thời gian bây giờ (và chúng ta thấy hầu hết mọi nơi), mà còn là nó đang ngày càng trở nên trực quan thú vị nhờ vào sự lựa chọn tùy biến cũng được sử dụng mà Google cung cấp.

Các trang web thú vị nhất theo xu hướng này xây dựng ý tưởng và chức năng thị giác của họ xung quanh một khái niệm bản đồ. Và chắc chắn họ sử dụng bản đồ Google tùy chỉnh để các trang nhìn và cảm nhận.

10 Giao diện Mashup

necotrans preview thiet ke web


Trang web thông qua necotrans

Các tình yêu bền bỉ cho một máy nhắn tin mang đến những thách thức mà có thể được giải quyết trong cách thân thiện và trực quan hấp dẫn sáng tạo, sử dụng. Thách thức là để phù hợp với rất nhiều thông tin và chức năng trên cùng một trang. Các trang có để có một cái nhìn hiện đại, sạch và dễ dàng để điều hướng.

Các giải pháp có thể đạt được những gì mà chúng ta gọi là giao diện mashup: một bố cục gồm nhiều "lớp" mà điều chỉnh các chức năng yêu cầu hoặc nội dung. Trên thực tế nó không phải là một khái niệm mới ở tất cả - đó là bản chất của các ứng dụng máy tính để bàn - nhưng nó đã không được rất phổ biến trong Internet chính thống cho đến nay. Gần đây, việc sử dụng giao diện như vậy đã được gia tăng, và họ đang ngày càng trở nên tinh tế hơn và chức năng.

Website Necotrans dường như có ít nội dung  trên gấp,  với một số ít câu phủ lên trên một bức ảnh toàn màn hình. Nhưng nhỏ, menu phía bên phải cho phép truy cập vào tất cả các tính năng cần thiết trong khu vực cùng một màn hình đến cho người dùng một tiện ích tìm kiếm trang web (với kết quả xuất hiện khi bạn gõ), tùy chỉnh bản đồ Google, widget tin tức và hình thức liên lạc.

11. Giảm thiểu

maemo big video2a thiet ke web

Trang web thông qua Maemo

Các cổ điển  KISS nguyên tắc ("Keep It Simple, Stupid" hoặc "Keep It Short and Simple") đã được sử dụng trong quân đội, doanh nghiệp và chính phủ kể từ năm 1960. Tuy nhiên, mặc dù bạn có thể làm việc chăm chỉ để đơn giản hóa thiết kế của bạn, có lẽ một số phòng để thúc đẩy quá trình này hơn nữa vẫn còn.

Các  Maemo  nhà hàng kể lại câu chuyện của mình với sức mạnh không thể cưỡng lại, sử dụng ngôn ngữ đơn giản nhất có thể, và sau đó người truy cập đang phải đối mặt với một cuộc gọi duy nhất để hành động ("Đặt bàn"), và tên của nhà hàng trên một nền tảng của sương mù lạnh xoáy trên vịnh hẹp .

Di chuyển xuống mang lại một vài hình ảnh trong một bố trí giản dị, với sự sắp xếp theo chiều ngang và thẳng đứng khó tìm. Các chủ đề của những bức ảnh có vẻ giản dị, quá. Tuy nhiên, duyệt trang này cung cấp một kinh nghiệm gợi cảm mãnh liệt. Hình thức khổ hạnh làm nổi bật chất lượng của hình ảnh, trong khi tối giản làm cho bạn đọc một vài câu họ quan tâm để chia sẻ một cách cẩn thận, như lời của sự khôn ngoan.

Những gì có thể học được ở đây? Bạn có thể giữ cho mọi thứ trực quan yên tĩnh (yêntĩnh!) Trong thiết kế web và vẫn đạt được một cái nhìn tuyệt vời! Hãy thử giảm thiểu các nội dung, hình thức và màu sắc càng nhiều càng tốt trong khi thêm lãi suất thông qua lớn, video thực tế.

12. Thế giới Wide Wait

loading thiet ke web


Ví dụ về các Preloaders đồ họa.

Bạn đã có thể nghe câu chuyện đùa này. Trong thập niên 90, khi modem 56k là cách chính để truy cập Internet, các "WWW" chữ viết tắt được sử dụng để được đùa dịch để "World Wide Wait". Tốc độ mạng nhanh đã làm cho chúng tôi gần như quên mất.

Hơn bao giờ hết, tốc độ nhanh hơn được cho phép chúng tôi tạo ra trang web mà có một chuyện không tưởng chỉ một thời gian ngắn trước đây - chẳng hạn như sử dụng video HD cho một nền website. Tuy nhiên, mỗi bước tiến có giá của nó, và trong trường hợp này, giá là thời gian. Cụ thể, thời gian tải.

Do đó, chúng ta có thể thấy một sự trở lại lớn Preloaders trực quan hấp dẫn. Không phải là hấp dẫn như họ sử dụng để được trong ngày Flash khi chúng biến thành những trò chơi nhỏ, nhưng vẫn còn những mảnh nghệ thuật theo cách riêng của họ.

13. Nhà thiết kế tự động hóa

thegrid1 thiet ke web

Một ảnh chụp màn hình của grid.io trang web cho thấy một lỗi mà không có con người sẽ có khả năng để thực hiện (chữ đen trên nền màu tối không đọc được).

Bài viết này sẽ không được hoàn thành mà không có lấy một chút thời gian để đề cập đến "Grid" - một ý tưởng hấp dẫn được trình bày bởi "nhà thiết kế chiết trung" mà thực hiện một số buzz gần đây. Đó là một nỗ lực để thay thế cho các nhà thiết kế và các coder với trí tuệ nhân tạo. Nhà thiết kế web sẽ trở nên dư thừa? Đó là chưa được nhìn thấy.

Nó không thể để kiểm tra hệ thống này chưa, vì vậy thật khó để đánh giá khả năng sử dụng của nó. Trang web của họ có vẻ là các cuộc biểu tình chỉ sức mạnh của nó. Nói chung nó hoạt động tốt trong hầu hết các nghị quyết, nhưng cố gắng để tạo ra nghệ thuật nhân tạo dường như là dấu hiệu của thời đại. Ví dụ,  The Fool Painting phần mềm sáng tạo vẫn chưa bị xóa sổ những bức tranh từ trưng bày nghệ thuật.

Phần kết luận

Những xu hướng thiết kế web 13 đã leo vào phổ biến trong năm qua và có thể sẽ bị ảnh hưởng nhiều cách trang web sẽ được tạo ra vào năm 2015. Tuy nhiên, nếu chúng ta tổng kết năm nay trong một câu, điều quan trọng nhất để suy nghĩ về khi thiết kế một website sẽ là "Nội dung đầu tiên".

Tác giả bài viết: Giang Nguyễn

Nguồn tin: LẬT ĐẬT WEB

Tổng số điểm của bài viết là: 0 trong 0 đánh giá

Click để đánh giá bài viết
Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây