Thiết kế vật liệu của Google bằng tiếng Nga. Google Material Design là gì và nó sẽ thay đổi cuộc sống của chúng ta như thế nào Bề mặt, tính chất và chức năng của chúng

Điều gì sẽ xảy ra nếu tuổi thơ của một người dành để nghe những bộ phim trong đó máy tính thông minh hơn chắc chắn sẽ giết chết toàn bộ nhân loại, và khi anh ta lớn lên một chút, chính người này sẽ đọc về NSA và những nhân vật phản diện khác đọc tin nhắn SMS của anh ta suốt ngày đêm và gửi chúng đến Mỹ? Anh ta sẽ cảnh giác với Google.

Cách đây không lâu, Good Corporation đã cho thế giới thấy tầm nhìn của mình về giao diện người dùng trong tương lai. Vật liệu thiết kế- một khái niệm thống nhất để xây dựng logic hoạt động và giao diện của các dịch vụ và ứng dụng, thống nhất tất cả các sản phẩm của Google nhằm giúp người dùng cảm nhận chúng dễ dàng và trực quan nhất có thể.

Ý tưởng này lớn đến mức nó sẽ biến đổi không chỉ diện mạo của tất cả các sản phẩm của Google. Với việc sắp tới khái niệm mới Vai trò của chính công ty trong cuộc sống của mọi người sẽ thay đổi.

Google sẽ trở thành gì?

Đúng, hiện tại Google chỉ là một loạt các dịch vụ. Tuy nhiên, với thiết kế vật liệu, công ty thực sự đang tạo ra thực tế thứ hai bên trong máy tính và máy tính của chúng ta. thiêt bị di động. Với logic riêng của nó, với các quy tắc và định luật riêng, với vật lý riêng của nó.

Khi bạn tạo ra những thứ vật chất, bạn rút ra được kinh nghiệm hàng ngàn năm của con người. Nhưng thiết kế phần mềm chỉ mới ở giai đoạn sơ khai. Chúng tôi đã xem xét mọi thứ chúng tôi có phần mềm và tự hỏi, nó được làm bằng gì? John Wiley, Trưởng nhóm thiết kế tìm kiếm của Google

Các dịch vụ của Google hiện nay dành cho mọi người là gì? Đây có phải là thanh tìm kiếm nằm trong trình duyệt không? Hay đó là thiết bị di động Android của bạn?

Google có thể được định nghĩa theo nhiều cách và nhiều cách trong số đó sẽ đúng. Công ty này đã tạo ra một hệ thống dịch vụ trở thành nền tảng cho cơ sở hạ tầng kỹ thuật số của chúng tôi.

Nhưng trong tương lai gần, Google sẽ không còn được coi chỉ là Chrome hay Android nữa.

Các dịch vụ và sản phẩm riêng lẻ của Google đang phát triển thành một kênh thông tin, nơi dữ liệu liên quan đến con người chỉ xuất hiện trên màn hình mong muốn vào đúng thời điểm.

Khi bạn nhìn đồng hồ khi đang đứng ở ga xe lửa, bạn sẽ thấy trên màn hình thời gian đến của chuyến tàu tiếp theo. Tuy nhiên, chiếc đồng hồ này sẽ cảnh báo bạn về một lá thư quan trọng từ ban quản lý nếu bạn nhìn thấy nó tại nơi làm việc. Đồng hồ này sẽ thay thế mật khẩu đăng nhập tài khoản của bạn trên máy tính, màn hình sẽ hiển thị ngay thi thể của người đó. lá thư quan trọng từ ông chủ. Bạn có cần phải đi gấp và không có thời gian để hoàn thành nội dung câu trả lời? Không vấn đề gì, vì trên điện thoại thông minh hoặc máy tính bảng của bạn, giao diện thư với văn bản in một nửa đã mở và thậm chí con trỏ vẫn ở vị trí bạn đã dừng lại.

Ngày làm việc kết thúc và bạn sẽ về nhà. Các màn hình giống nhau hiện thực hiện các chức năng hoàn toàn khác nhau. Họ sẽ nhắc bạn đón con, mua đồ tạp hóa cho bữa tối và thông báo cho bạn khi bạn rời đi loạt phim mới loạt phim yêu thích.

Một loạt các chức năng và nhiệm vụ được thực hiện đáng kinh ngạc như vậy sẽ hoạt động trong một môi trường kỹ thuật số duy nhất trực quan cho người dùng, dần dần hòa nhập với thế giới thực.

Một trong những ý tưởng chính của Material Design là tạo ra cảm giác trực quan cho người dùng khi làm việc với các vật thể thực trong môi trường kỹ thuật số. Về cơ bản, đây là sự mô phỏng không gian ba chiều trên mặt phẳng màn hình, nhưng với tất cả những lợi thế mà nó có thể mang lại. Môi trường ảo. Các nút và cửa sổ ở đây, tương tự như những tấm bìa cứng, có thể to ra và co lại, tách ra và tự sắp xếp lại.

Điều ấn tượng nhất về khái niệm này là các thuộc tính và hành vi của các vật thể trên màn hình sẽ dễ đoán và dễ hiểu đối với con người như bất kỳ sự kiện đơn giản nào trong thế giới vật chất. Không giống như các giao diện hiện có, trong đó việc nhấn nút không gây ra bất kỳ thay đổi nào đối với phần còn lại của màn hình, bất kỳ hành động nào trong Android L đều gây ra hiệu ứng tương ứng ảnh hưởng đến toàn bộ giao diện. Chạm vào một ngày cụ thể trên lịch và nó sẽ tăng lên, đẩy khối lượng và khối lượng ngày càng tăng của những ngày còn lại. Nhấn nút phát trong trình phát và nó sẽ mở ra giống như một gói kẹo trong bảng điều khiển.

Khái niệm này là kết quả nghiên cứu cẩn thận của công ty về cách hoạt động của giấy trong thực tế. Nhóm làm việc trong dự án đã tạo ra các biểu tượng ứng dụng vật lý từ giấy thật. Họ muốn xem ánh sáng và bóng tối có thể tương tác như thế nào với một vật liệu phẳng (như màn hình) nhưng thực.

Ngược lại, môi trường ảo cho phép bạn phá vỡ các quy tắc. Chắc hẳn chưa ai từng thấy giấy bị chia thành nhiều phần, các mảnh được sắp xếp lại và hợp nhất lại thành một vật thể duy nhất. Điều này mang lại Tính năng bổ sung, nhưng có nguy cơ tạo ra một hệ thống quá phi thực tế, quá xa rời các định luật vật lý. Để duy trì tính trực quan tự nhiên, tất cả kiểu chữ, hình ảnh và màu sắc đều bị loại bỏ trong quá trình phát triển. Nhóm nghiên cứu tập trung hoàn toàn vào việc thực hiện bài báo thần kỳ.

Bạn không cần phải là nhà thiết kế mới có thể phát hiện hành vi vi phạm quy tắc thế giới thực. Tờ giấy có rơi xuống bàn như một tảng đá không? Rõ ràng là có điều gì đó không ổn ở đây và bất cứ ai cũng sẽ rõ.

Dựa trên những quy luật rõ ràng và dễ hiểu đối với mọi người, nhóm Google đã quyết định sử dụng thế giới thực làm nền tảng cho các khái niệm của họ.

Nếu có một hệ thống quy tắc đủ rõ ràng thì có thể bổ sung thêm các tài liệu mới. Tờ giấy đã sự lựa chọn rõ ràng do sự đơn giản của việc hiển thị trên màn hình. Không có kết cấu rõ rệt, thực tế không có khối lượng. Nhưng hãy thử tưởng tượng, chẳng hạn như vải hoặc chất lỏng.

Triết lý về chủ nghĩa đa dạng mà Apple đã tích cực sử dụng và cuối cùng đã từ bỏ ngay lập tức xuất hiện trong đầu bạn phải không? Cách tiếp cận của Apple cũng nhằm mục đích làm cho thế giới kỹ thuật số trở nên thân thiện hơn với người dùng, nhưng so với Quyết định của Google nó trông khá hời hợt. Tính đa hình của Apple chỉ ám chỉ sự giống nhau của ứng dụng với phiên bản đời thực của nó.

Google không chỉ muốn đưa ra một số phép loại suy để có được nhận thức tốt hơn. Mục tiêu của họ là giải thích cho người dùng điều gì sẽ xảy ra khi một thành phần giao diện cụ thể xuất hiện hoặc biến mất khỏi màn hình.

Material Design không chỉ là nỗ lực tạo ra các dịch vụ được thiết kế giống hệt nhau cho nhiều thiết bị khác nhau. Google đang tạo ra một thế giới song song, mỗi hạt trong đó là một mảnh vật chất nào đó. Khi bạn nhận được tin nhắn trên đồng hồ thông minh từ điện thoại thông minh, bạn không chỉ thấy một đoạn văn bản chết. Đó là một miếng bìa cứng có chứa thông điệp trên đó và thông điệp đó được gửi từ điện thoại thông minh đến cổ tay của bạn.

Sự tương tác thế giới kỹ thuật số hoàn toàn có thể những cách khác. Nó có thể là một cái gì đó hình tròn trên cổ tay của chúng ta hoặc một cái gì đó hình chữ nhật trong tay chúng ta. Material Design nhằm mục đích đảm bảo rằng quyền truy cập vào dữ liệu có liên quan và phù hợp được đảm bảo, bất kể sự kết hợp của các thiết bị mà một người sử dụng.

Đây là cách mà không bị áp đặt hay áp lực, công ty chỉ đơn giản tạo ra các công nghệ dựa trên nguyên tắc then chốt “tập trung vào người dùng và mọi thứ khác sẽ tự đến”.

Chúng tôi quan tâm đến ý kiến ​​​​của bạn. Bạn có coi khái niệm như vậy là xấu xa hay bạn coi những sáng kiến ​​​​đó là một cách tương tác đầy hứa hẹn với môi trường thông tin trong tương lai?

Material Design là một khái niệm thiết kế được tạo ra để thống nhất các dịch vụ, giao diện và các sản phẩm khác. Khái niệm này được Google phát triển và giới thiệu tới đông đảo khán giả vào ngày 25 tháng 6 năm 2014 tại hội nghị Google I/O. Cốt lõi của sự phát triển bảng màu, thuộc tính và thành phần của đối tượng thiết kế. Material Design được các nhà phát triển bổ sung và cập nhật thường xuyên. Nói bằng ngôn ngữ đơn giản, ý tưởng cơ bản là một thiết kế dạng khối mở ra và gấp lại thành hình khối giống như những tấm thiệp, sử dụng hiệu ứng đổ bóng. Bản thân các thẻ nên chuyển đổi suôn sẻ với nhau.

Chiến lược của thiết kế này dựa trên việc tạo ra trải nghiệm người dùng toàn diện, khả năng thâm nhập các dịch vụ vào nhiều lĩnh vực nhất. Những khu vực khác nhau hoạt động cuộc sống của người dùng PC.

Khi tạo ra các đồ vật, chúng ta tiến hành từ kinh nghiệm hàng thế kỷ và dựa vào nó. Nhưng thiết kế phần mềm- đây vẫn chỉ là mới ra đời và có hệ thống phát triển sản phẩm. Nhìn vào nó một cách trọn vẹn, chúng tôi tự hỏi: nó bao gồm những gì?

- John Wiley, Giám đốc thiết kế, Google Tìm kiếm

Nguyên tắc chính

Các nguyên tắc chính của Material Design bao gồm bề mặt xúc giác, thiết kế in ấn, hoạt ảnh có ý nghĩa và thiết kế thích ứng.

Bề mặt xúc giác. Giao diện bao gồm "giấy kỹ thuật số". Các lớp “giấy” này được đặt chồng lên nhau và tạo bóng. Nhờ những cái bóng này, người dùng PC hiểu rõ hơn những điều cơ bản khi làm việc với giao diện.

Thiêt kê in ân."Giấy kỹ thuật số" hiển thị "mực kỹ thuật số". Đối với hình ảnh mực kỹ thuật số, phương pháp thiết kế áp phích hoặc tạp chí truyền thống được sử dụng. Các yếu tố chính của thiết kế in ấn là tỷ lệ, lưới, màu sắc và không gian. Từ đó, trọng tâm, thứ bậc và ý nghĩa được tạo ra. Nhờ màu sắc, phông chữ, kích thước, nền và các yếu tố khác, thiết kế giao diện đã được tạo ra. Sử dụng nó tập trung sự chú ý vào chính chức năng, những điểm chính của quản lý sản phẩm hoặc dịch vụ.

Hoạt hình ý nghĩa. Sự rõ ràng và dễ hiểu của hoạt ảnh ứng dụng ảnh hưởng trực tiếp đến thời gian người dùng sử dụng máy tính cá nhânđể hiểu kết quả của các hành động được sử dụng trong chương trình này. Hoạt ảnh là một loại gợi ý để quản lý giao diện Material Design.

Thiết kế thích ứng. Một trong những tính năng của Material Design là tính linh hoạt của nó, tức là khả năng sử dụng ba thành phần được mô tả ở trên trên các thiết bị khác nhauà, chẳng hạn như máy tính, điện thoại, máy tính bảng, v.v.

Bề mặt xúc giác

Bề mặt xúc giác là những mảnh “giấy kỹ thuật số” tương tự, không giống như giấy thông thường, có siêu năng lực - chúng có thể kéo dài, kết nối và thay đổi hình dạng.

Bề mặt

Bề mặt là một phần của thành phần thiết kế tạo ra bóng làm cho thành phần này khác với thành phần khác. Material Design hướng đến sự đơn giản tối đa và thiết kế “sạch sẽ”.

Thiết kế “thuần túy” thường được gọi là khả năng truyền tải các thuộc tính của một vật thể thông qua độ dốc hoặc bóng mà không cần sử dụng cấu trúc. Tất cả các bề mặt đều có bóng riêng và độ cao nhất định.

Chiều sâu

TRONG " thiết kế phẳng“Cố gắng không sử dụng bóng thể hiện âm lượng. Đồng thời, bóng được thiết lập một hệ thống phân cấp nhất định và cấu trúc của các thành phần giao diện. Bóng sâu làm nổi bật chủ thể chính và tập trung sự chú ý vào đó một cách tinh tế và trang nhã.

Độ sâu là manh mối về cách các vật thể tương tác. Tại thời điểm người dùng cuộn, tấm màu xanh lá cây được gắn vào lớp trên cùng và tạo thành bóng. Điều này thể hiện rõ ràng không chỉ sự chuyển động của “mực” mà cả sự chuyển động nền trắng nằm bên dưới.

Lớp sâu dưới cùng là "đáy".

  • Hãy nhớ hậu cần. Nhiều những hộp thoại, các cửa sổ nổi, thanh công cụ có độ cao nhất định. Để tránh va chạm, chúng cần định kỳ di chuyển dọc theo trục Z.
  • Đừng ép các nút. Bạn chỉ nên sử dụng nút nổi trong trường hợp cần thiết vì việc sử dụng nút này ngay lập tức mang lại hiệu ứng Material Design cho thiết kế. Bạn không nên sử dụng nó để xác nhận bất kỳ hành động nào hoặc đóng cửa sổ.
  • Không phải tất cả mọi thứ cần phải có trên thẻ. Chỉ nên sử dụng thẻ khi đối tượng chứa nhiều hình thức và lượng nội dung lớn. Đối với các tùy chọn khác, sẽ hợp lý hơn khi sử dụng văn bản hoặc danh sách truyền thống.
  • Chủ nghĩa tối giản trong hộp thoại. Hộp thoại chỉ nên được sử dụng để xác nhận hành động của người dùng khi có câu hỏi.

Thiêt kê in ân

Tất cả các đối tượng nằm trên bề mặt của thiết kế vật liệu đều được áp dụng “mực kỹ thuật số”. Những đối tượng này là hình ảnh, bài kiểm tra, chữ tượng hình. Việc sắp xếp các đồ vật này tuân theo nguyên tắc thiết kế in ấn.

Kiểu chữ thanh lịch

Kiểu chữ rất quan trọng trong thiết kế in ấn. Nó thiết lập cấu trúc nội dung và ảnh hưởng đến sự hình thành phong cách của một thương hiệu cụ thể.

Kiểu chữ tạo thành một cấu trúc gồm các phần tử có kích thước, phông chữ, thứ bậc riêng. Với sự trợ giúp của chúng, chúng tôi hiểu trực quan những phần tử nào quan trọng hơn và tại sao một số trong số chúng là chính còn những phần khác chỉ là thứ yếu.

Kiểu chữ tương phản

Một lần nữa nguyên tắc quan trọng in ấn là một sự tương phản của kiểu chữ. Dễ dàng nhận thấy rằng dòng tiêu đề lớn và phông chữ tối màu có nghĩa là điều gì đó quan trọng và cơ bản, trong khi văn bản nhỏ hơn và tông màu nhạt hơn có nghĩa là thông tin thứ cấp. Độ tương phản cho phép bạn làm nổi bật những điểm chính, mang lại tính thẩm mỹ tổng thể cho nội dung.

Lưới mô-đun và hướng dẫn

Trong khi thiết kế màn hình sử dụng lưới cơ bản thì thiết kế in ấn sử dụng lưới mô-đun. Đối với Material Design, lưới có bước 8dp được sử dụng.

Một tính năng đặc biệt của vị trí nội dung trong Material Design là vị trí của các nguyên tắc cơ bản. Nhờ chúng, các vết lõm được tạo ra từ viền màn hình, ảnh hưởng đến cấu trúc nội dung trang và khả năng kiểm soát ánh nhìn của người dùng. Kết quả là ở giữa màn hình, chúng ta thấy văn bản chính và yếu tố bổ sung nằm bên ngoài nó, ở biên giới.

Hình tượng hình học

Các biểu tượng đơn giản nhất từ ​​​​lâu đã được sử dụng trên nền tảng hệ thống Android. Trong Material Design, chúng trông thậm chí còn đơn giản hơn và đẹp mắt hơn.

Ví dụ: các chỉ báo và nút được làm nổi bật bằng màu sắc tươi sáng, phong phú. Nhờ những màu sắc này, chúng tập trung vào các yếu tố điều khiển chính (nút nổi, v.v.). Nếu cần đưa thêm màu sắc vào thiết kế thì nên sử dụng các sắc thái cơ bản, kín đáo.

Tải xuống các biểu tượng về chủ đề:

Màu sắc

Màu sắc trong thiết kế chịu trách nhiệm về tính biểu cảm. Trước đây, trong Android, cách phối màu chỉ là thứ yếu, nhưng bây giờ nó được gán một trong Những vai trò chủ đạo. Trong Material Design, bảng màu cơ bản bao gồm các sắc thái nhấn và chính.

Thanh hành động được sơn màu chủ đạo và thanh trạng thái làm nổi bật nó với tông màu bão hòa hơn. Màu nhấn được sử dụng cho sọc, chỉ báo, nút nổi. Nó thu hút sự chú ý đến các yếu tố chính của bảng.

Điểm nhấn được đặt theo từng điểm và với số lượng nhỏ. Đối với phần còn lại của giao diện, màu sắc được sử dụng theo quy tắc: để lại một lượng lớn văn bản (danh sách các chữ cái trong thư). kích thước tiêu chuẩn và thêm màu sắc để thu hút sự chú ý của người dùng PC; một lượng nhỏ văn bản (máy tính, ảnh) được tăng kích thước lên 2-3 lần và thêm các khuôn màu.

Trong hệ thống Android, bạn có thể tô màu giao diện một cách linh hoạt, tức là làm nổi bật các màu chính trong tổng thể bức ảnh.

Những bức ảnh đẹp

Trong Material Design, bạn có thể và thậm chí cần sử dụng nhiều hình ảnh và hình minh họa khác nhau. Hình ảnh thường không có khung. Bản thân thanh trạng thái được làm không màu để không làm phân tán sự chú ý khỏi hình ảnh. “Mực kỹ thuật số” luôn được sử dụng không chỉ vì vẻ đẹp mà còn vì chức năng của thiết kế.

  • Xây dựng thương hiệu được khuyến khích.
  • Chúng ta không được quên thụt lề và không gian trống (đối với lưới cơ sở 8dp, đối với thụt lề - 72 dp).
  • Sử dụng hình ảnh tươi sáng.

Hoạt hình có ý nghĩa

Material Design, giống như thế giới vật chất, sử dụng hoạt ảnh có ý nghĩa để hiển thị cho người dùng những gì đã xảy ra tại thời điểm đó. Nghĩa là, người dùng sẽ thấy rằng không một vật thể nào từ đâu đến và biến mất vào hư không.

Ví dụ 1. Hoạt ảnh cho thấy rằng thẻ cụ thể này, khi được nhấp vào, sẽ xuất hiện ở nền trước, mở ra và hiển thị nhiều thông tin hơn.

Ví dụ 2. Khi bạn nhấp vào một ngày trong lịch, một sự kiện sẽ bật lên, được tách ra một cách trơn tru dưới dạng một lớp khỏi lịch chung, biến thành một khối riêng biệt và được hiển thị trong một khối riêng biệt chi tiết kèm theo mô tả về sự kiện này.

Hoạt ảnh giúp tập trung sự chú ý của người dùng và tập trung ánh nhìn vào các hành động của giao diện.

Sự phản ứng lại

Một lần nữa điểm quan trọng hoạt hình trong Material Design được coi là một phản ứng đối với hành động nhất định Người sử dụng máy tính. Những thay đổi trong giao diện Android L xảy ra sau khi bạn chạm vào ngón tay. Những thay đổi này được phản ánh dưới dạng hành động giống như làn sóng.

Hoạt hình vi mô

Hoạt hình vi mô là cực kỳ quan trọng. Chúng được sử dụng như một phản hồi cho mọi thao tác của người dùng. Điều này làm cho giao diện chi tiết hơn và phản hồi nhanh hơn.

Rõ ràng và sắc nét

Nguyên tắc cuối cùng của hoạt hình là sự rõ ràng và sắc nét của hành động. Material Design có đường cong hoạt hình thú vị. Tất cả các đối tượng nhanh chóng phản ứng với hành động của người dùng, quay trở lại mạnh mẽ, nhưng mất nhiều thời gian hơn một chút để đóng băng và chuyển sang trạng thái bình tĩnh cuối cùng. Cuối cùng, người dùng không lãng phí thời gian chờ đợi, điều đó có nghĩa là họ không cảm thấy khó chịu hoặc trải qua những cảm xúc tiêu cực khi tương tác với giao diện.

  • Hãy suy nghĩ trước về hoạt hình.
  • Sử dụng hoạt ảnh một cách tối ưu (không nên sử dụng quá nhiều vì tất cả hoạt ảnh phải có ý nghĩa).

Thiết kế thích ứng

Khía cạnh quan trọng cuối cùng của Material Design là khái niệm thiết kế thích ứng. Điều này có nghĩa là các tùy chọn để áp dụng ba khía cạnh còn lại trên các màn hình thiết bị khác nhau (điện thoại, PC, TV, v.v.).

Từ chung đến cụ thể


Phương pháp phổ biến nhất là nén lượng thông tin cùng với việc nén chính màn hình. Bạn có thể chứa nhiều nội dung trên TV của mình. Đầu tiên, điện thoại sẽ hiển thị một danh sách, bạn có thể nhấp vào danh sách này để xem thông tin chi tiết.

Thụt lề

Trên màn hình lớn, nội dung được đặt bằng các khối. Chúng lấp đầy không gian trống và có thể được kéo dài theo chiều rộng. Việc kéo dài xảy ra với khả năng đọc được nội dung. Trên phần còn lại của màn hình, các vết lõm được tạo ra để có thể đặt các nút hoặc ô nổi trên đó.

Hướng dẫn


Thụt lề được thiết lập bằng cách sử dụng hướng dẫn. Độ rộng của vết lõm đối với điện thoại thông minh, máy tính bảng, máy tính và TV sẽ hoàn toàn khác nhau. Vì vậy, đối với máy tính bảng là 80 dp và đối với màn hình điện thoại thông minh là 72 dp.

Kích thước

Tất cả các thành phần giao diện phải có nhiều tỷ lệ. Kích thước màn hình của máy tính bảng và điện thoại thông minh khác nhau, nhưng các ứng dụng sử dụng các thành phần có nhiều thông số sẽ thích ứng với mọi kích thước thiết bị.

Khối

Lưới mô-đun, bao gồm các khối, giúp thiết lập nhịp điệu trực quan để đưa ra quyết định tối ưu.

Thanh công cụ

Thanh hành động- một trong những thành phần chính của giao diện. Nó chứa các nút hành động và tiêu đề. Trong Android L, thanh hành động đã trở thành một đơn vị điều khiển chức năng và hấp dẫn. Điều này đạt được nhờ thực tế là các biểu mẫu, nút nổi và điều hướng kéo ra với các điều khiển thuận tiện có thể được đặt trong Thanh công cụ.

  • Bạn không nên sử dụng ngăn điều hướng cho công cụ đơn giản. Bạn chỉ nên sử dụng điều hướng cho nhiều tác vụ trong ứng dụng.
  • Hãy táo bạo với các thanh công cụ.
  • Đặt nút nổi ở vị trí tối ưu nhất. Đừng chụp chặt vào góc dưới cùng.
  • Thực hành các yếu tố giao diện theo cả chiều dọc và chiều dọc màn hình ngang thiết bị.

Vật chất như một phép ẩn dụ

Các nhà phát triển của Google đã cố gắng kết hợp thiết kế đẹp, hấp dẫn với những đổi mới của khoa học và công nghệ hiện đại.

Chủ nghĩa duy vật ở quả cầu kỹ thuật sốĐây không phải là lần đầu tiên chúng được sử dụng. Vì vậy, Apple gần đây đã sử dụng triết lý skeuomorphism (bắt chước nhận thức về các vật thể trực quan từ thế giới vật chất xung quanh chúng ta) trong thiết kế giao diện.

Một ví dụ điển hình về điều này là ứng dụng Newsstand. Ở đây chúng ta hình dung ra những đồ vật quen thuộc: báo, tạp chí đặt trên kệ. Bằng cách lật qua các tạp chí này, chúng tôi mô phỏng việc lật một cuốn sách bình thường thực sự từ Cuộc sống hàng ngày. Như vậy, đời sống truyền thống hiện thực được nhân đôi trong “kỹ thuật số”.

Phát triển thiết kế kỹ thuật số

Đại đa số người dùng tương tác với môi trường kỹ thuật số hàng ngày. Chúng không còn yêu cầu sự tương đồng chính xác giữa các vật thể ảo và thế giới thực. Tất cả người dùng làm quen với thời điểm này càng sớm thì thiết kế kỹ thuật số càng sớm có thể bắt đầu tích cực tiến lên.

Dựa trên điều này, Material Design không còn bị ảnh hưởng bởi chủ nghĩa đa dạng nữa. Bây giờ đây chỉ là một bước mới trong quá trình phát triển của các vật thể ảo.

Khả năng hiển thị là cơ sở cơ bản

Bề mặt và cạnh của các điều khiển khác nhau trong Material Design tạo ra các tín hiệu về cách điều hướng và thao tác trên giao diện, tương tự như các hành động trong đời thực.

Đặc điểm xúc giác của đồ vật giúp phân biệt đồ vật chính với đồ vật bổ sung và xác định mối quan hệ giữa chúng.

Nguyên tắc cơ bản của thiết kế vật liệu cũng bao gồm các nguyên tắc thiết kế in ấn. Không chỉ chú trọng đến tính thẩm mỹ mà còn tạo ra một cấu trúc, hệ thống phân cấp đặc biệt và tạo ra một hệ thống quản lý đơn giản.

Thành phần trực quan của Material Design dựa trên: màu sắc phong phú, các cạnh sắc nét, kiểu chữ lớn và thụt lề lớn giữa các phần tử khác nhau.

Động lực có ý nghĩa

Sự chú ý chính tập trung vào hành vi (hành động) của người dùng. Sự tương tác của anh ấy với thiết kế diễn ra trên cơ sở trải nghiệm người dùng tích lũy và không có gì khác.

Ví dụ về các trang web theo phong cách Thiết kế Vật liệu

Ngay khi bản concept xuất hiện trên Internet, rất nhiều đại diện của Material Design đã xuất hiện trên mạng.

Các trang web mẫu được tạo tuân thủ nghiêm ngặt các nguyên tắc cơ bản của Thiết kế Vật liệu. Chúng đơn giản và rõ ràng, chứa các nút nổi, bóng, màu sánghiệu ứng hình ảnh, điều hướng trơn tru. Tất cả điều này làm tăng thêm trải nghiệm người dùng tuyệt vời.



Video

Material Design đã thu hút một lượng lớn khán giả. Anh ấy trình bày cách tạo giao diện người dùng một cách chính xác sao cho người dùng hoàn toàn dễ hiểu và rõ ràng, giống như một vật thể quen thuộc trong thế giới thực mà bạn có thể chạm vào bằng tay.

Roman Nurik, một trong những nhà thiết kế Nhóm Google, mô tả cách ứng dụng I/O 2014 thay đổi trong quá trình phát triển để tuân thủ các nguyên tắc của Material Design. Chúng tôi đã dịch video của anh ấy đặc biệt dành cho bạn.

Video từ kênh Google Design.

Tại hội nghị dành cho nhà phát triển Google I/O 2018, ngoại trừ Android đã cập nhật và hội nhập sâu hơn trí tuệ nhân tạo tới các dịch vụ của bạn, công ty Google trình bày tiêu chuẩn mới trong thiết kế hệ thống và ứng dụng di động- Thiết kế Vật liệu 2.0. Có gì mới?

Khoảng trắng và độ trong suốt

Một trong những điều nhất những thay đổi đáng chú ý Thiết kế vật liệu mới có lượng màu bão hòa và nền xám tối thiểu, chỉ có khoảng trắng đồng nhất và độ trong mờ. Theo tôi, điều này trông rất mới mẻ, từ đó đưa hệ điều hành và phần mềm lên tầm cao mới. cấp độ mới nhận thức trực quan. Từ nay trở đi, cài sẵn Android P, không có tiện ích bổ sung đồ họa từ nhà sản xuất bên thứ ba, Tôi thực sự coi đây là giải pháp đẹp nhất trong số các giao diện. IMHO.

Công cụ phát triển mới:

Chủ đề vật chất


Plugin Material Theme dành cho Sketch về cơ bản là một thư viện phông chữ, biểu tượng và màu sắc công ty được cung cấp theo hướng dẫn mới của Google trong Android P. Ngoài ra, khi phát triển với sự trợ giúp của nó, bạn có thể chỉnh sửa hình dạng của các thành phần và kiểu chữ trong dự án của mình một cách dễ dàng. số lần nhấp chuột.

Làm tròn và tối giản hơn


Như nhiều người đã lưu ý, ngoại hình đã trở nên rất giống với Apple iOS 10 và 11, nhưng chắc chắn bước này được công ty thực hiện đặc biệt dành cho các nhà sản xuất và chủ sở hữu điện thoại thông minh không khung, số lượng trong số đó đang tăng lên đáng kể hàng năm, bởi vì diện mạo của hệ thống và phần mềm này hoạt động tốt hơn nhiều với màn hình tròn của chúng.

Phông chữ mới


Thiết kế logo mới và dịch vụ có thương hiệu nhà phát triển và nhà thiết kế của Google Chúng tôi đã sử dụng kiểu chữ Product Sans. Một nhánh đặc biệt của Google Sans đã được tạo cho họ. Nó dựa trên phông chữ nói trên, thay thế phông chữ Roboto tiêu chuẩn.


Vì vậy, chúng ta có thể sớm mong đợi một cuộc thiết kế lại quy mô lớn cho tất cả các trang web và thiết bị di động dịch vụ của Google. Hiện tại, một trong những đứa con đầu lòng của kho ứng dụng là Google Chơi game, Google Tasks và một ứng dụng dành cho người tham gia hội nghị Google I/O 2018.
  • Phong cách cập nhật của minh họa công ty

  • Sử dụng bốn màu cơ bản của logo làm ngôn ngữ hình ảnh

Ví dụ, Một phiên bản mới Gmail:

Ý tưởng thiết kế vật liệu 2.0


Tất nhiên, cộng đồng thiết kế đã phản hồi những thay đổi thiết kế sắp tới từ Google và đúng một tháng trước, một người dùng Reddit với biệt danh Morphicsn0w đã trình bày tầm nhìn của mình về trang Google Play.


Ngoại trừ thay đổi trực quan Theo ý kiến ​​​​của mình, dưới dạng thẻ tròn trình bày các ứng dụng, tác giả đã loại bỏ những phần không cần thiết, chẳng hạn như các ứng dụng được tải xuống gần đây, từ đó làm cho giao diện cửa hàng đơn giản và nhiều thông tin hơn.


Trên màn hình mô tả ứng dụng, Morphicsn0w đã tập trung vào mô tả ứng dụng, chuyển trọng tâm ra khỏi thông tin về số lượt tải xuống và xếp hạng của người dùng.


Nhà thiết kế cũng thiết kế lại hệ thống tìm kiếm trong Google Play, bổ sung thêm tính năng sắp xếp kết quả tìm thấy theo giá, ngày cập nhật, xếp hạng và số lượt tải xuống. Sự hiện diện của tính năng sắp xếp như vậy sẽ đơn giản hóa đáng kể việc tìm kiếm phần mềm cần thiết trong cửa hàng, tôi đang chờ đợi và hy vọng Google triển khai tính năng đó.


YouTube được yêu mến, tác giả của cổng 9to5Google và nhà thiết kế giỏi bán thời gian Alex Brooks, cũng đã mơ mộng về những gì có thể thay đổi trong ứng dụng lưu trữ video hiện tại, cũng không bị bỏ qua. Kết quả cá nhân đã truyền cảm hứng cho tôi rất, rất nhiều.


Điều đầu tiên Alex thay đổi là thanh điều hướng màn hình chính, sơn nó bằng những màu sắc tươi sáng, vui tươi. Sau điểm đầu tiên có dòng tìm kiếm được thiết kế lại, bây giờ nó không được hiển thị nút riêng biệt, nhưng chiếm toàn bộ khu vực hữu ích của phần trên cùng của ứng dụng, do đó đơn giản hóa việc truy cập vào nó. Và thanh số lượng người đăng ký, nút đăng ký kênh và quay lại cấp độ trước đó theo quan điểm của tác giả nằm ở phía dưới, đây cũng là một giải pháp hữu ích xét về mặt dễ sử dụng.


Nhà thiết kế đã kết hợp phần thư viện (lịch sử video đã xem, quản lý video đã tải xuống, video đã thích, v.v.) với phần cài đặt hồ sơ người dùng, giờ đây cả hai tham số đều có thể được truy cập bằng cách nhấp vào ảnh người dùng. Theo tôi, mặc dù điều này còn gây tranh cãi nhưng ở một mức độ nào đó nó vẫn có ý nghĩa giải pháp đúng, vì nó đơn giản hóa sự tương tác của người dùng với dịch vụ và làm cho ứng dụng trở nên dễ hiểu hơn đối với những người dùng mới, những người mới làm quen với thế giới công nghệ di động.


Hơn thông tin chi tiếtĐọc về khái niệm YouTube từ Alex trong bài viết gốc.

Khái niệm Google Play Âm nhạc trong Material Design 2.0


Lấy cảm hứng từ bài thuyết trình và hàng tá tác phẩm của các nhà thiết kế khác, tôi quyết định thử làm điều gì đó của riêng mình, sử dụng một trong những dịch vụ hiện tại của Google làm cơ sở, lựa chọn của tôi đã rơi vào Chơi nhạc. Tôi chưa bao giờ làm việc với dịch vụ này trước đây, đặc biệt là với tư cách là một nền tảng phát trực tuyến, nhưng vì không có nhiệm vụ nên tôi phải làm vậy. Dịch vụ này tạo ra những ấn tượng cực kỳ tích cực, nếu chỉ vì bản thân ứng dụng hoạt động bình thường và không gặp sự cố, không giống như Apple Âm nhạc, mà tôi đã sử dụng kể từ khi phát hành trên Android.


Nhìn chung, các dịch vụ tương tự nhau và cả hai đều thực hiện nhiệm vụ chính - phát nhạc. Và cả hai đều có phàn nàn về giao diện, nhưng vì hôm nay chúng ta đang nói về Google nên chúng tôi sẽ xem xét dịch vụ của họ cho phù hợp.

Màn hình chính


Điều phàn nàn đầu tiên về màn hình chính là tôi không thích nó như thế nào không gian rộng lớn, chiếm độc quyền Thanh tìm kiếm và bìa danh sách phát với các lựa chọn. Trên thực tế, trước hết, tôi quyết định khắc phục điều này.


Theo ý tưởng của tôi, màn hình chính vẫn như cũ, nhưng được thiết kế lại một chút với các lựa chọn album, bài hát, danh sách phát dựa trên sở thích của người dùng, chỉ bây giờ để xem nội dung và phát bản nhạc mong muốn, bạn không cần phải thực hiện một cú nhấp chuột thêm và rời khỏi màn hình chính, điều tương tự cũng áp dụng cho quá trình chuyển đổi giữa các phần (trang chủ, gần đây, cuộc diễu hành nổi tiếng, v.v.), giờ đây có thể được thực hiện bằng cách vuốt qua màn hình.

Người chơi


Điểm thứ hai chưa thành công trong thiết kế, theo tôi, chính là người chơi. TRONG ứng dụng chính thức Bìa bài hát của Google Play Âm nhạc trải dài theo toàn bộ đường chéo của màn hình điện thoại thông minh, đó là lý do tại sao trên các thiết bị có màn hình độ phân giải cao trông rất luộm thuộm và lem luốc. Tôi đã trình bày giải pháp cho vấn đề như sau:


Giờ đây, các bìa được đặt gọn gàng ở giữa và bản xem trước của các bản nhạc trước và tiếp theo được hiển thị ở cạnh trái và phải, như thể gợi ý về khả năng chuyển đổi chúng bằng một cú vuốt.

Thư viện phương tiện


Điều thứ ba tôi không thích ở Play Music là cách bố trí và trang trí của thư viện media. Theo tôi, cấu trúc của nó quá phức tạp. Ví dụ, để truy cập phần này từ màn hình chính, bạn cần thực hiện tối đa bốn hành động: vuốt để gọi thanh bên; bấm để chọn phần “Thư viện nhạc”; vuốt qua danh sách để chọn tab mong muốn (danh sách phát, đài phát thanh, nghệ sĩ, album).


Do đó, tôi đã di chuyển nút có quyền truy cập vào các bản nhạc đã thêm vào thanh dock bên dưới và khi nó mở ra, theo mặc định, tab album sẽ được hiển thị với khả năng sắp xếp chúng theo ngày phát hành, phần bổ sung và bảng chữ cái.

Menu/Thanh bên


Để phù hợp với các nguyên tắc thiết kế ứng dụng mới của Google, tôi đã chuyển menu thông thường có quyền truy cập vào cài đặt sang góc trên bên phải.


Trình bày khái niệm Google Play Âm nhạc trên Behance

Phần kết luận


Tóm lại, tôi muốn nói rằng tôi rất hài lòng với con đường mà Google đang cố gắng đi theo. Ngoài bước nhảy vọt lớn trong sự phát triển và sự tiện lợi của các dịch vụ của mình, công ty đang tiến về phía trước với mã thiết kế của mình. Cách đây sáu tháng, viết một bài viết về trải nghiệm sử dụng iOS 6 vào năm 2018, tôi chợt nghĩ rằng trong những năm qua, hệ điều hành di động Android và iOS không phát triển nhiều về mặt hình ảnh và thiết kế ý tưởng của giao diện, nhưng bây giờ tôi tôi hoàn toàn không bị thuyết phục về quan điểm của mình, ít nhất là liên quan đến Android.

Cám ơn vì sự quan tâm của bạn!

  • Hướng dẫn
Các nút có thể có hình lục giác?

Google I/O 2018 còn lại số lượng lớn tài liệu để hiểu. Có gì mới? Làm sao để sống xa hơn? Ứng dụng của tôi có lỗi thời không? Các nút có thể có hình lục giác? Các nhà thiết kế không còn cần thiết nữa? Sẽ dễ chịu hơn khi hiểu từ từ và theo từng phần nhỏ. Phần này là về thiết kế.

Sau bốn năm, tôi đã khá chán ngán với Material Design. Qua theo Google, 1,5 triệu ứng dụng đã được tạo ra dựa trên hệ thống thiết kế này. Tại sao? Suy cho cùng, ban đầu nó được tạo ra cho nhu cầu nội bộ của Google.

Nó giải quyết được các vấn đề về thiết kế không đồng nhất cho Android và việc thiếu bất kỳ hệ thống nào
- Nó phổ biến cho các thiết bị khác nhau: máy tính bảng, điện thoại thông minh, web.
- Nó được thiết kế theo quan điểm của người dùng và trực quan.

Hệ thống này bị cáo buộc là không linh hoạt và kết quả là nhận được một thiết kế sao chép bằng carbon. Nếu bạn thiết kế một dịch vụ tuân thủ nghiêm ngặt các hướng dẫn thì về mặt trực quan, các ứng dụng sẽ thực sự trở nên vô nghĩa. Mặt khác, tại sao lại đổ lỗi cho hệ thống? Những nguyên tắc chưa bao giờ là kinh thánh; người ta có thể đi chệch khỏi chúng. Có lẽ bạn chỉ chọn màu cho ứng dụng của mình trong bảng màu Google Color? Tôi hy vọng là không.

Mặt khác, bằng cách thêm các yếu tố tùy chỉnh, bạn có nguy cơ gặp các nhà phát triển Android của mình trong một con hẻm tối và nghe một bài phát biểu dài về lý do và mức độ sai của bạn. Đây là thời điểm nguy hiểm.

Tất cả những người chiến thắng Giải thưởng Thiết kế Vật liệu đều gặp rủi ro như nhau. Bạn có nhận thấy giao diện người dùng của các dự án này tùy chỉnh như thế nào không? Nhưng Google đã khuyến khích họ và mọi người đều ngạc nhiên.

Bây giờ thì rõ ràng: Google muốn chúng tôi tùy chỉnh ứng dụng của mình. Sản phẩm phải đẹp và khác biệt. MD được cập nhật là một nỗ lực nhằm hướng dẫn các nhà thiết kế và doanh nghiệp cách tùy chỉnh giao diện người dùng mà không sợ bị các nhà phát triển mắng.

Material.io – Thiết kế, Phát triển, Công cụ

Bạn có thể bắt đầu tìm hiểu hệ thống thiết kế từ trang web - không chỉ một số nội dung đã được cập nhật ở đó mà còn cả phong cách hình ảnh. Giờ đây, ngay cả màn hình 404 cũng sẽ hướng dẫn bạn và bằng cách nhấp vào một phần tử từ hướng dẫn, bạn sẽ thấy thông số kỹ thuật của nó với tất cả khoảng cách, phông chữ và liên kết để tải xuống từ thư viện Google.

Kết quả vẫn chưa ấn tượng. Lợi ích lớn nhất đáng lẽ phải là mã được tạo sẵn cho các phần tử gốc, nhưng liên kết GitHub không thú vị lắm. Cũng còn quá sớm để yêu cầu các nhà phát triển thêm các phần tử mới vào ứng dụng của bạn - mã cho chúng vẫn chưa được cung cấp.

Điều gì sẽ xảy ra nếu các phần tử của bạn không phải là bản địa? Bạn có thể nhìn thấy các dấu hiệu nhưng bạn sẽ không thể có được các biểu tượng bị cắt. Vì vậy, còn quá sớm để nói về việc thay thế Zeplin.

Nhà truyền giáo thiết kế Mustafa Kurtuldu của Google về việc sử dụng công nghệ của họ trong việc phát triển ứng dụng Keep và Inbox.

Để đánh dấu

Bản dịch được thực hiện bởi đội ngũ trường Anh ngữ trực tuyến Skyeng.

Material Design cung cấp một bộ công cụ và quy tắc giúp bạn tiếp cận thiết kế UX một cách có ý thức khi tạo giao diện ứng dụng.

Nhưng điều gì sẽ xảy ra nếu những nguyên tắc này không hiệu quả đối với một sản phẩm nhất định? Và các nhà thiết kế của Google sẽ làm gì khi họ phát triển một sản phẩm vượt xa những nguyên tắc cổ điển?

Nguyên tắc vật chất có tính thích ứng. Trong bài viết này, chúng ta sẽ xem xét hai ứng dụng Google, Keep và Inbox, để hiểu cách chúng không chỉ đi chệch khỏi một số quy tắc mà còn hình thành các quy tắc mới. Nguyên tắc vật chất Thiết kế.

Hộp thư đến: Lưới mô-đun

Phát triển mới dịch vụ bưu chính- một mục tiêu rất tham vọng đối với Google, khi mà Gmail đã có mặt trên thị trường. Mục tiêu của Inbox là tăng thêm chiều sâu cho thiết kế giao diện, đồng thời tạo ra trải nghiệm người dùng và nhận dạng thương hiệu độc đáo, tuân theo các quy tắc mới của Material Design.

Khi nhóm Inbox đang đối chiếu các thiết kế sơ bộ, ý tưởng Thiết kế Vật liệu vẫn đang được phát triển. Điều này mang đến cho Inbox một cơ hội tuyệt vời để đặt ra các tiêu chuẩn cho Material Design đồng thời giải quyết thách thức về chiều sâu và khối lượng trong giao diện người dùng.

Chiều sâu

Thiết kế ban đầu của Inbox không đủ linh hoạt—không gian lưới chỉ cho phép bảy email vừa với màn hình 13 inch. Con số này là quá ít, đặc biệt là so với Gmail, vốn chỉ chứa được 16-20 chữ cái.

Nếu bạn mở Gmail và Inbox trong các cửa sổ liền kề, bạn có thể thấy sự khác biệt lớn về trọng lượng hình ảnh. Và một trong những điều nhất nhiệm vụ phức tạp là tìm sự cân bằng phù hợp giữa nội dung và khoảng trắng.

Tim Smith

Trưởng nhóm thiết kế tại Inbox

Bằng cách thay đổi cài đặt lưới, độ cao của dòng và giao diện của phông chữ, các nhà thiết kế Inbox có thể đạt được độ sâu tối ưu trong giao diện trong khi vẫn hiển thị 12-17 chữ cái, mỗi chữ cái bên trong thẻ Material Design. Giao diện ứng dụng thích ứng với thiết bị của người dùng. Ví dụ: phông chữ ở dòng “Chủ đề” thay đổi tùy theo kích thước màn hình.

Màu sắc, hình ảnh và biểu tượng

Sử dụng hình ảnh theo ngữ cảnh trong các nhóm email là một cách khác đặc điểm phân biệt dịch vụ. Ví dụ: nếu người dùng đang lên kế hoạch cho một chuyến đi đến New York, anh ta sẽ nhìn thấy bầu trời Manhattan trên thẻ có chữ cái tương ứng.

Có rất nhiều biểu tượng trên thanh điều hướng bên trái, màu sắc của chúng tương ứng với chức năng của chúng trong ứng dụng. Khi người dùng nhấp vào nút Hoàn thành màu xanh lá cây, nền bảng trên cùng cũng chuyển sang màu xanh lục, cho biết bối cảnh đã thay đổi.

Bảng trên cùng

Một nhiệm vụ quan trọng khác của nhóm là phát triển thanh trên cùng của ứng dụng. Ý tưởng ban đầu là tạo ra một bảng điều khiển có thể biến đổi, không kéo dài theo chiều rộng của cửa sổ trình duyệt nhưng sẽ thay đổi tùy thuộc vào nội dung.

Chúng tôi đã làm việc khoảng chục Các tùy chọn khác nhau khái niệm này cho đến khi cuối cùng chúng tôi đi đến chế độ toàn màn hình, mà bạn thấy bây giờ. Chúng tôi cũng đã tạo ra một số khái niệm về thanh tìm kiếm trước khi chọn kiểu tốt nhất.

Tim Smith

Trưởng nhóm thiết kế tại Inbox

Các thẻ trong Inbox mở rộng và thu gọn, nghĩa là định dạng tiêu đề thay đổi tùy thuộc vào cách người dùng tương tác với bằng email. Thanh trên cùng cũng hiển thị thanh tìm kiếm và menu với các ứng dụng khác của Google. Cách tiếp cận này cho phép Inbox duy trì khả năng thích ứng mà không làm phức tạp giao diện.

Giữ: Mẫu điều hướng đáp ứng

Keep là ứng dụng ghi chú đa nền tảng, có khả năng mở rộng và thu gọn các thẻ trên màn hình, tập trung sự chú ý của người dùng khi thêm ghi chú mới. Thanh điều hướng phía dưới cho phép bạn nhanh chóng tạo ghi chú mới chỉ bằng một cú nhấp chuột.

Tương tác, màn hình trống và hoạt ảnh

Thông thường, người dùng sẽ phải đối mặt với một màn hình trống khi không có nội dung trên trang. Trong Keep, màn hình này trông giống như một khung vẽ trống nơi người dùng có thể nhanh chóng ghi lại ý tưởng của mình.

Khoảng trắng khuyến khích người dùng khám phá các mục menu trong bảng điều khiển mở rộng để hiển thị các bộ lọc khác nhau được biểu thị dưới dạng biểu tượng; menu bố cục cho phép bạn chuyển đổi giữa danh sách và lưới cũng như thanh điều hướng bên trái nơi bạn có thể thay đổi cài đặt ứng dụng cơ bản.

Chúng tôi đã làm việc rất nhiều về hoạt ảnh - cách hiển thị các ghi chú dưới dạng luồng, cách chúng di chuyển khi bạn mở và đóng chúng.

Genevieve Cuevas

Chọn các thành phần vật liệu phù hợp: Nút điều hướng dưới cùng hoặc Nút hành động nổi

Sự chính xác và dễ sử dụng là những tính năng chính của Keep. Trong quá trình thiết kế lại ứng dụng, các nhà phát triển đã nghiên cứu các mẫu Material Design và cuối cùng đã chọn các thẻ giúp phân biệt các ghi chú với nhau, thanh điều hướng bên trái giúp dễ dàng tùy chỉnh ứng dụng và menu ngữ cảnh thay đổi tùy theo loại ghi chú - như ghi chú bằng các hộp kiểm hiển thị menu để kiểm tra và thay đổi các thành phần trong danh sách.

Khi kết hợp với nhau, những yếu tố này tạo nên một sự rõ ràng và giao diện chức năng, thích ứng với hoàn cảnh cụ thể. Khi thiết kế lại Keep, những người sáng tạo đã thử nghiệm một số thành phần điều hướng cơ bản của ứng dụng - đặc biệt, họ đã cố gắng thay thế điều hướng hiện có bằng nút tác vụ nổi.

Điều hướng ban đầu cho phép bạn tạo ghi chú mới chỉ bằng một lần nhấn và nút tác vụ nổi yêu cầu hai lần nhấp: một lần để hiển thị các tùy chọn và lần thứ hai để tạo ghi chú.

Khi chúng tôi giới thiệu nút nổi, một số người dùng phàn nàn rằng việc tạo ghi chú chỉ bằng hai lần nhấp chuột không thuận tiện bằng.

Genevieve Cuevas

Kỹ sư phần mềm Google Keep

Nhiều người dùng đã sử dụng ứng dụng trước đây và đã quen với việc điều hướng bằng một cú nhấp chuột đã không chấp nhận thay đổi này. Bằng cách thử nghiệm và cuối cùng từ chối nút nổi, các nhà phát triển Keep đã có thể chọn giải pháp phù hợp nhất với lợi ích sản phẩm của họ.

Một hướng dẫn, không phải một bộ quy tắc

Nhóm Keep và Inbox đã sử dụng các nguyên tắc này làm cơ sở cho ứng dụng của họ. Khi gặp phải tình huống người dùng không hoạt động, họ có thể điều chỉnh thiết kế của mình cho phù hợp với nhu cầu của người dùng.

Material Design cung cấp hướng dẫn dựa trên số năm trải nghiệm Google, nhưng với sự trợ giúp của nó, hoàn toàn không thể giải quyết được bất kỳ vấn đề nào. Ví dụ về Keep và Inbox cho thấy rằng bạn có thể sử dụng các nguyên tắc Material Design, thay đổi chúng nếu cần cho sản phẩm của mình.