Bộ sưu tập thiết kế đồng hồ kỹ thuật số

 (clocks.dev)
1 điểm bởi GN⁺ 23 giờ trước | 1 bình luận | Chia sẻ qua WhatsApp
  • Clocks.dev là trang web cho phép khám phá tại một nơi các thiết kế đồng hồ kỹ thuật số thể hiện thời gian và ngày hiện tại theo nhiều cách khác nhau
  • Có thể so sánh các cách biểu đạt trực quan khác nhau như hình học, bố cục chữ số, tổ hợp từ, kim đồng hồ, mặt số tròn, LCD, v.v.
  • Có thể xem thiết kế theo các tiêu chí All time, This week, Newest, và cũng có thể tự tạo thiết kế đồng hồ mới
  • Bao gồm các đồng hồ có tên thể hiện cách biểu đạt hoặc phong cách như number-field, word-field, binary-signal, swiss-railway, corner-date
  • Vì tất cả đồng hồ đã đăng đều là mã nguồn mở, có thể dùng không chỉ để thưởng thức thiết kế mà còn để tham khảo ý tưởng triển khai

Khám phá nhiều cách biểu đạt thời gian

  • Clocks.dev cung cấp tập hợp nhiều thiết kế đồng hồ kỹ thuật số
  • Có thể duyệt danh sách bằng các bộ lọc All time, This week, Newest, và tạo đồng hồ mới tại Create new clock

  • Hình dạng và kim đồng hồ

  • Chữ số và từ ngữ

    • binary-signal: thiết kế sử dụng tín hiệu nhị phân
    • number-field: cấu thành thời gian bằng trường chữ số gồm 1~12 và 1~60
    • word-field: hiển thị thời gian bằng tổ hợp từ như FIVE, TEN, QUARTER, HALF, PAST, TO
    • mint-rounded, lock-screen, second-tilt: cấu thành hiển thị thời gian dựa trên chữ số theo các phong cách khác nhau

  • Ngày tháng và thông tin bổ sung

    • day-mood: hiển thị khung giờ và nhiệt độ bằng câu như It’s slow evening o’clock 22°
    • corner-date, orbit-date: hiển thị ngày tháng cùng với thời gian
    • đồng hồ màu sắc: liên kết 86.400 giây trong một ngày với một trong 16.777.216 màu và hiển thị mã màu hiện tại
    • Galactic Standard Time: biểu thị thời gian cùng với thông tin khu vực và track
    • Digital Quartz LCD: phong cách LCD kỹ thuật số bao gồm 1983, ngày trong tuần, 24H, cùng các hiển thị báo thức, tín hiệu, đèn và bắt đầu

  • Khái niệm riêng lẻ

Mã nguồn mở và nhà sáng tạo

  • Tất cả đồng hồ đã đăng được cung cấp dưới dạng mã nguồn mở
  • Trang web do Lev Miseri tạo ra

Bài viết liên quan

1 bình luận

 
GN⁺ 23 giờ trước
Các ý kiến trên Hacker News

  • Làm cho vui một đồng hồ số được tạo thành từ các đồng hồ kim: https://mikespeed.com/clock

  • Trước cơn sốt AI, tôi đã tự tay làm tất cả các mặt đồng hồ thử nghiệm bằng SVG và JavaScript
    Có thể không phải tác phẩm gì ghê gớm, nhưng với tư cách một designer, tôi tự hào vì đã tự học lập trình cơ bản để hoàn thành nó: https://watchface.netlify.app/
    Tôi cũng đã viết lại quá trình thực hiện: https://72mena.medium.com/designing-watch-faces-using-svgs-a...

    • Nhìn tác phẩm này khiến tôi muốn quay lại với phần cứng và chế tạo PCB để làm một món có thể treo lên tường
      Sẽ còn hay hơn nếu trên trang mặt đồng hồ đang chạy, có thể nhập trực tiếp thời gian để xem nó hiển thị ra sao
    • Tôi vào đây định nhắc đến thiết kế của Tokyoflash, gặp nó ở đây thấy vui thật

  • Có lẽ đã đến lúc gom những người mê đồng hồ trên HN lại để làm một webring kiểu cũ
    Lock Screen khá giống đồng hồ Filling Digit của tôi, trong đó các chữ số rỗng được nước lấp đầy từ dưới lên để biểu thị giây
    Alphabetical Clock khá thú vị cũng từng gây chú ý trên HN, còn khái niệm webring có thể xem trên Wikipedia

  • Tôi đã thử tái hiện Voutilainen Vingt-8 ISO bằng Svelte, lần đầu tiên sử dụng nó: https://clocks.dev/clock/3b254b2789ec

    • Đây là một khái niệm tôi mới gặp lần đầu, nhưng có vẻ sẽ nhanh quen; nó cũng khiến tôi muốn có một chiếc đồng hồ đeo tay như vậy

  • Trên Chrome 150.0.7871.115 và Windows, từ khoảng 2/3 trang trở đi thanh cuộn biến mất và không thể cuộn tiếp

    • Hiện đã sửa, nhưng vấn đề hiệu năng căn bản hơn vẫn cần điều tra thêm
    • Tôi cho rằng động vào hành vi cuộn mặc định của trình duyệt là một điều rất kiêng kỵ trong phát triển web
    • Vấn đề tương tự cũng xảy ra trên Firefox 152.0.5 của Windows 11

  • Number Field cho cảm giác là cách biểu diễn không gian tốt nhất cho đồng hồ số
    Để hoàn hảo thì cần đổi sang định dạng 24 giờ, nhưng đó chỉ là chỉnh sửa nhỏ; nhờ cấu trúc 12 cột nên rất dễ nắm bắt thời gian tương đối chỉ trong nháy mắt

  • Tôi đã làm một đồng hồ Soroban dùng bàn tính Nhật, nhưng vì dùng animation dựa trên CSS nên không thể thêm vào bộ sưu tập: https://soroban-clock.netlify.app

  • 12 o’clocks của John Maeda cũng rất đáng xem
    Qua tác phẩm năm 1996, tôi đã có cách nhìn mới về cách thời gian được biểu đạt bằng đồ họa; cũng có thể xem nó trong bộ sưu tập của MoMA
    Đặc biệt vì những tác phẩm chuyển động mượt mà, tôi bắt đầu ghét kim giây giật từng giây một, nên đã thay bộ máy của tất cả đồng hồ trong nhà sang kiểu kim giây quét liên tục

  • Đồng hồ nhị phân có vẻ xem vị trí bên trái hàng 8 là hàng 10, chứ không phải hàng 16 như thông thường
    Vì vậy 10 giờ không hiển thị là 1010 mà là 00010000, còn 23 giờ là 00100011, nếu diễn giải như số nhị phân thì thành 35 nên trông khá lạ

    • Không phải chuyển thời gian thành một số nhị phân duy nhất, mà là chuyển từng chữ số thập phân thành 4 bit
      Tức là 23 → 2 3 → 0010 0011 → 00100011

  • Một số đồng hồ có vài chỗ lệch nhẹ
    Number Field màu cam có vẻ khó phân biệt 12:10 với 10:12, còn Word Field hiển thị các ký tự không dùng bằng X, làm giảm đi cảm giác huyền bí khi các từ xuất hiện trong Word Clock gốc
    Temporal Exposure có dải vùng mờ bị lệch khỏi tâm, còn Figure Hands thì chữ bị tràn ra ngoài vùng hình minh họa

    • Trong Number Field, giờ luôn chỉ nằm ở hàng trên cùng, nên 12:10 và 10:12 được hiển thị khác nhau
    • Nếu bạn nói đến Figure Hands thì nhìn chung vẫn còn nhiều chỗ để cải thiện phong cách
      Có lẽ sẽ tốt hơn nếu dùng hai màu và các kích thước khác nhau, cùng một phông chữ phù hợp hơn