- Ikon PuTTY mempertahankan gaya kuno yang dibuat pada akhir 1990-an hingga awal 2000-an, lalu dirender ulang berkali-kali agar sesuai dengan perubahan ukuran layar dan kebutuhan platform
- Versi awal berupa gambar 32×32 yang digambar piksel demi piksel di MSVC icon editor, mencerminkan keterbatasan saat itu seperti palet 16 warna yang direkomendasikan Windows dan ikon hitam-putih
- Elemen seperti dua komputer, petir, dokumen, topi, kunci, dan kunci pas dipakai untuk membedakan peran tiap alat sambil tetap terlihat sebagai satu keluarga produk PuTTY
- Sekitar 2007, ketika tampilan ikon 48×48 di Windows membuat hasil pembesaran dari 32×32 terlihat buruk, ikon 48×48, 32×32, 16×16, dan versi hitam-putih mulai dibuat otomatis lewat skrip
- Setelah itu, untuk mengatasi keterbatasan skrip bitmap pada ukuran besar, dibuat skrip pembangkit SVG, tetapi untuk ikon kecil skrip lama tetap memberi hasil yang lebih baik
Titik awal ikon PuTTY
- Pada Maret 2025, sebuah email yang menanyakan asal-usul dan perubahan “logo” berupa ikon file executable Windows PuTTY menjadi pemicu untuk merangkum ceritanya
- Kerangka dasar desain ikon saat ini dibuat pada akhir 1990-an dan awal 2000-an, dan sejak itu dipertahankan tanpa perubahan gaya besar
- Seiring waktu, ikon-ikon itu harus dirender ulang di bawah berbagai batasan, sehingga ini bukan hanya masalah desain grafis tetapi juga masalah teknis
Masa menggambar piksel dengan tangan
- Pada awalnya tidak diperkirakan bahwa ikon dalam banyak ukuran akan dibutuhkan, jadi gambar dibuat langsung di MSVC icon editor tanpa otomatisasi
- Program GUI Windows tanpa ikon sulit dikenali, jadi sejak awal PuTTY memerlukan ikon tersendiri
-
PuTTY utama
- Ikon PuTTY tertua yang masih tersisa adalah versi yang dipakai pada awal 1999, dan tidak ada riwayat pengelolaan sumber yang tersisa hingga masa awal proyek pada musim panas 1996
- Ikon itu berukuran 32×32 piksel dan memakai palet terbatas yang terdiri dari warna primer dan nuansa abu-abu
- Pada pertengahan 1990-an, layar non-truecolour masih umum, dan untuk ikon Windows disarankan memakai palet 16 warna tetap
- Pendekatannya adalah seluruh ikon GUI memakai kembali 16 entri palet yang sama agar lebih sedikit memakai sumber daya warna layar
- Versi hitam-putih juga disediakan sesuai rekomendasi saat itu
- Meski tidak ada ingatan pernah benar-benar melihatnya pada layar hitam-putih setelah Win95, hal ini mungkin berkaitan dengan Win32s yang memungkinkan program 32-bit dijalankan di Windows 3.1
- Desainnya menampilkan dua komputer berbentuk monitor CRT dan unit sistem yang umum pada 1990-an, dihubungkan oleh petir
- Petir itu menyiratkan komunikasi elektrik
- Alasan pemakaian petir kuning dan layar biru tidak tercatat jelas
- Layar biru itu bukan berarti Windows Blue Screen of Death, karena dalam penggunaan PuTTY biasa hanya satu sisi yang menjalankan Windows dan tidak ada yang sedang crash
-
PSCP dan PSFTP
- Pada 1999, seorang kontributor mengirim implementasi SCP, lalu lahirlah PSCP dan ikon terpisah juga digambar
- Karena PSCP tidak bisa dipakai tanpa argumen command line, kebutuhan praktis untuk menjalankannya dari GUI atau mengenalinya di Start Menu tidak terlalu besar
- Ikon PSCP mengambil ikon PuTTY lalu mengganti salah satu komputer dengan dokumen, dan menghubungkan komputer yang tersisa dengan dokumen itu lewat petir
- Setelah itu, alat transfer berkas PSFTP juga memakai ulang ikon yang sama
- Berbeda dengan PSCP, PSFTP masih bisa dijalankan tanpa argumen command line karena target koneksi bisa dimasukkan dari prompt interaktif, sehingga ikon yang sama lebih berguna untuk PSFTP
- Memakai ikon yang sama untuk dua alat berarti perlu lebih cermat membedakannya di Explorer, tetapi tidak ditemukan cara visual yang mudah untuk menandai perbedaannya
-
Pageant
- Pageant adalah SSH agent, dan awalnya ada niat membuat ikon berupa wajah agen rahasia
- Ekspresi wajah itu gagal, tetapi topi bertepi lebar yang tergambar memuaskan tetap dipakai dengan menaruhnya di atas komputer PuTTY
- Dengan mendaur ulang desain komputer yang sama, tampilannya tetap cocok secara visual dengan keluarga produknya, dan juga sesuai dengan kenyataan bahwa agent milik Pageant adalah agent terkomputerisasi, bukan manusia
- Ikon awal Pageant tidak punya versi hitam-putih, tetapi membutuhkan ikon kecil 16×16 untuk masuk ke System Tray
- Karena hasil pengecilan ikon 32×32 oleh Windows tidak bagus, anti-aliasing pada pita topi dan kontur monitor dibuat manual untuk ukuran kecil
- Garis luarnya tetap hitam agar kontras dengan latar belakang
-
PuTTYgen
- Ikon PuTTYgen menggabungkan komputer, petir, dan kunci
- Kunci itu merupakan permainan visual ringan untuk menunjukkan bahwa alat ini membuat dan menangani kunci kriptografi
- Karena PuTTYgen tidak melakukan komunikasi jaringan, petir sebenarnya tidak akurat secara fungsional, tetapi tetap dipakai demi konsistensi visual sebagai alat dalam keluarga PuTTY
- Berbeda dengan PSCP, arah penempatan komputer dan objeknya dibalik sehingga kedua ikon lebih mudah dibedakan
-
Dialog pengaturan
- Entri taskbar untuk dialog pengaturan PuTTY memakai ikon jendela Windows bawaan, dan tampilannya terasa kurang enak dilihat
- Alih-alih memakai ulang ikon utama apa adanya, dibuat ikon dengan kunci pas besar sebagai lapisan tambahan untuk menandakan konfigurasi atau modifikasi
- Ikon ini kembali memiliki versi hitam-putih, mungkin karena dibuat dengan memodifikasi ikon yang memang sudah punya versi hitam-putih
Ikon yang digambar ulang dengan skrip
- Sekitar 2007 mulai muncul keluhan bahwa ikon 32×32 terlihat buruk
- Layar makin besar dan Windows mulai menampilkan ikon 48×48 sebagai default, sehingga ikon aplikasi yang hanya punya versi 32×32 akan terlihat sebagai hasil pembesaran
- Karena 48 bukan kelipatan 32, Windows membesarkan ikon secara tidak merata dan hasilnya jadi lebih jelek
- Alih-alih menggambar ulang seluruh set ikon dengan tangan, dibuat skrip pembangkit yang menggambar tiap komponen ikon secara terprogram
- Dengan skrip ini, ikon 48×48, 32×32, dan 16×16 untuk semua alat dibuat otomatis
- Ketidakkonsistenan seperti hanya sebagian ikon yang punya versi kecil atau hitam-putih pun hilang
- Semua ikon akhirnya memiliki semua versi
- Bagian tersulit adalah ikon 16×16
- Penilaian anti-aliasing yang dulu diterapkan manual pada Pageant harus direproduksi dalam kode
- Pendekatan yang sama juga harus diterapkan ke semua komponen grafis
- Hasil skrip tidak persis sama dengan gambar tangan asli
- Ikon PuTTY menghasilkan versi yang sangat mirip, hanya berbeda beberapa piksel
- Ikon Pageant berubah bukan hanya pada anti-aliasing pita topi, tetapi juga pada ukuran komputernya
- Skrip itu juga dibuat agar bisa menghasilkan ikon hitam-putih
- Pada 2007 mungkin sudah jauh lebih jarang ada orang memakai Windows di layar hitam-putih
- Namun berkat otomatisasi, bahkan ikon hitam-putih 48 piksel pun bisa dibuat
pterm dan ikon X11
- Pada 2002, sebagian besar kode PuTTY di-port ke Linux, lalu lahirlah GUI PuTTY untuk Linux dan emulator terminal X11 pterm
- Program X11 dapat mengatur bitmap ikon pada properti jendela
- Window manager bisa memakainya sebagai ikon saat diminimalkan, entri taskbar, ikon di bingkai jendela, dan sebagainya
- Pada 2002 diyakini bahwa GTK 1 tidak mendukung pengaturan ikon jendela, dan menyediakan beberapa format berkas bitmap juga terasa merepotkan, jadi ikon tidak dibuat saat itu
- Setelah skrip pembangkit hadir, keluaran ke berbagai format berkas menjadi mudah, dan diketahui pula bahwa GTK 1 sebenarnya bisa mengatur properti ikon
- Karena pterm tidak melakukan komunikasi jaringan, ikonnya digambar sebagai satu komputer besar tanpa petir
- Dialog pengaturan pterm memakai ulang lapisan kunci pas seperti pada ikon pengaturan PuTTY
- Pada 2021, menjadi mungkin membuat pterm yang berjalan di Windows, dan ikon ini pun dipakai untuk pterm versi Windows
Ikon installer dan pengolahan warna
- Skrip pembangkit dapat menghasilkan ikon true colour juga, sehingga tidak lagi terikat pada palet 16 warna lama
- Ikon installer PuTTY menampilkan kotak kardus terbuka dan petir yang keluar menuju komputer
- Gambar yang dimaksud adalah “PuTTY melompat keluar dari kotak ke mesin pengguna”
- Kotak kardus itu membutuhkan warna cokelat, tetapi cokelat tidak ada dalam palet ikon Windows 16 warna lama
- Pada ikon true-colour, warna cokelat sungguhan bisa dipakai
- Meski begitu, ikon 16 warna tetap dipertahankan demi kompatibilitas ke belakang
- Merah tua
#800000dicampur masing-masing 50:50 dengan hitam#000000, kuning tua#808000, dan kuning#ffff00untuk menghasilkan tiga warna yang mendekati cokelat - Pada true-colour dipakai warna rata-ratanya, sedangkan pada versi 16 warna ditampilkan sebagai halftone dengan menyusun piksel dua warna palet secara bergantian
- Merah tua
Set ikon yang dibuat ulang dalam SVG
- Skrip ikon lama bekerja baik pada 32×32 dan 48×48, dan hasil pengecilan ke 16×16 juga lumayan, tetapi kualitasnya buruk jika diperbesar lebih jauh
- Dalam upaya porting Mac yang gagal, diperlukan ikon 128×128 untuk dock MacOS, dan keluaran ukuran itu dari skrip lama dianggap tidak memuaskan
- Porting Mac itu sendiri pada dasarnya ditinggalkan, tetapi ikon yang benar-benar dapat diskalakan penuh tetap bisa berguna untuk keperluan lain
- Bisa dipakai di konteks selain ikon GUI
- Misalnya untuk kaus atau stiker laptop
- Skrip pembangkit ikon kedua dibuat dengan meniru cara berpikir skrip lama, tetapi mengeluarkan berkas SVG alih-alih bitmap
- Versi SVG saat ini terdiri dari delapan ikon: PuTTY, pengaturan PuTTY, pterm, pengaturan pterm, PSCP, Pageant, PuTTYgen, dan installer
- Untuk ikon kecil, SVG tidak bisa mengetahui penilaian anti-aliasing, sehingga skrip lama memberi hasil render yang lebih baik
- Untuk ikon besar, terutama ketika dibutuhkan bitmap besar true colour, pendekatan yang disarankan adalah merendernya dari basis SVG
Alasan mempertahankan gaya lama
- Keadaan set ikon PuTTY saat ini pada dasarnya adalah mempertahankan gaya 1990-an sambil menambahkan beberapa cara rendering
- Ada juga orang yang menentang keseluruhan gaya 1990-an dan mengusulkan set desain baru, tetapi belum ada usulan yang cukup disukai untuk diadopsi
- Gaya 1990-an dipandang sebagai sesuatu yang membuat PuTTY terlihat cukup kuno untuk terasa meyakinkan
- Tampaknya kecil kemungkinan akan ada desain ulang besar yang benar-benar diterima, dan kemungkinan selama umur proyek ikon yang sekarang, atau yang sangat mirip dengannya, akan tetap dipakai
1 komentar
Opini Hacker News
Saya sempat terhenti di bagian yang mengatakan aneh bahwa petir berwarna kuning, karena bagi saya kuning terasa sebagai warna yang “jelas” benar
Bahkan jika mencari gambar, petir kuning adalah simbol paling umum untuk listrik, dan rambu bahaya standar hitam-kuning juga langsung terbayang
Saya tidak tahu seberapa lama ungkapan ini secara historis atau dari mana asalnya, tetapi di komik dan kartun sepertinya sudah lama dipakai luas
Rambu bahaya kematian akibat sengatan listrik di Inggris juga bukan berlatar hitam, melainkan berlatar kuning dengan warna hitam: https://www.hse.gov.uk/electricity/nearelectric.htm#signs
Namun kalau mencari gambar petir, memang terlihat cukup banyak pilihan seperti sian di atas biru royal, ungu, merah, dan sebagainya
Mungkin pada akhir 90-an pilihan warna seperti ini terasa sepenuhnya alami dan mengikuti konvensi desain Windows, jadi tampaknya ia lupa bahwa saat itu hal tersebut tidak terlalu dipikirkan secara mendalam
Kuning sejak lama disukai sebagai warna dengan visibilitas tinggi, dan pada bodi peralatan industri pun piktogram seperti itu akan terlihat jelas untuk menunjukkan bahaya sengatan listrik tanpa bergantung pada bahasa
Pada akhirnya, petir kuning tampaknya dipertahankan karena semacam inersia “memang selalu begitu”
Salah satu alasan PuTTY terasa menarik justru ada di titik itu. Aplikasi yang terlihat seperti PuTTY punya semacam rasa menenangkan
Entah tampilan lama itu memberi rasa stabil karena tidak berubah, atau karena memakai elemen bawaan sistem operasi sehingga terlihat lebih konsisten
Sebaliknya, pada aplikasi dengan estetika “modern”, semakin banyak Material Design, sudut membulat, efek transisi, kontras rendah, dan ruang kosong besar, semakin besar pula rasa tidak percaya dan skeptis
Saya tidak punya kualifikasi untuk melakukan analisis psikologis, tetapi melihat ada kelompok yang menyukai desain ala PuTTY, tafsir seperti ini mungkin tidak terlalu langka
Tampilan seperti itu tidak menjamin pasti cepat, dan bisa saja membuang waktu di tempat lain atau hanya meniru tampilan itu dengan rumit, tetapi ada juga kemungkinan itu benar-benar benda asli yang merespons seketika seperti Notepad lama
Saya merindukan Notepad yang “cukup memasukkan file ke kontrol teks, dan tidak peduli pada
\ratau\nsemacam itu”. Itu program yang tidak berpura-pura menjadi sesuatu yang bukan dirinya dan hanya menjalankan perannya dengan tepatDulu rasanya saya pernah melihat implementasi ulang Notepad dalam assembly; kode lem yang menghubungkan akses file ke kontrol teks kira-kira setengah layar, dan mungkin bahkan ada menu
ctrl+hserta dialognyaMirip dengan glue code yang dibanggakan Python, tetapi ini assembly murni dan tidak punya dependensi selain DLL akses file serta set kontrol standar minimum
Sekarang semuanya memakai widget “Windows modern” yang besar, atau lebih buruk lagi, Electron
Bisa jadi itu tombol, bisa jadi kotak teks, atau bisa jadi hanya persegi
Kalimat “Saya sadar bahwa jika menunggu sampai bisa menggambar ikon yang diinginkan, Pageant tidak akan pernah dirilis sama sekali” terasa mengena
Banyak proyek yang ingin saya utak-atik berhenti di hambatan yang ditimbulkan sendiri seperti ini
Secara pribadi, contoh paling khas adalah buntu saat menentukan nama repositori atau nama folder tingkat atas
Dalam budaya hacker, manajemen proyek selalu diremehkan seolah-olah pemborosan, tetapi menemukan cara agar proyek terus bergerak maju adalah peran yang bernilai
Entah kenapa saya cukup buruk dalam menentukan hal seperti nama repositori, variabel, dan struct
Pada akhirnya saya mendapat logo yang jauh lebih sederhana daripada rencana awal, tetapi lebih masuk akal
Ia mengatakan tidak ingat mengapa memilih warna biru untuk layar, tetapi pada ikon Win 3.x dan Win95, biru adalah warna standar saat menggambarkan layar, jadi sepertinya ia hanya mengikuti konvensi itu
EDIT.COMdan program instalasi MS-DOS juga memakai latar biruFaktanya, biru, yaitu warna CGA nomor 1, sangat populer sebagai warna latar di banyak alat
Pada hal-hal seperti Turbo Pascal dan Turbo C, latar biru dengan teks putih adalah tema warna yang umum, dan Borland dBase mencampur latar biru dan sian di beberapa layar
Karena warna yang tersedia saat itu terbatas, biru adalah salah satu dari sedikit warna latar yang nyaman di mata
Saya juga ingat Windows 3.1, 95, 98, dan sebagainya memakai biru sebagai warna layar pada ikon yang melambangkan komputer
Pada ikon dengan dua komputer seperti “Network Neighborhood”, salah satu layarnya biru dan yang lain sian
Saya sampai harus memperbesarnya untuk memastikan apakah itu bukan ikon yang sama
Ini membangkitkan nostalgia. Sekitar tahun 2000, saya mem-fork PuTTY dan membuat versi bernama “RedBrick PuTTy”, lalu menambahkan tombol untuk terhubung SSH ke redbrick.dcu.ie dalam sekali klik
redbrick.dcu.ie adalah server terminal milik Dublin City University Networking Society, dan saya tidak ingat apakah saat itu saya administrator sistem atau webmaster
Tapi saya ingat mengedit logonya secara manual untuk memasukkan bata merah
Bisa terlihat samar di gambar ini: https://wiki.redbrick.dcu.ie/images/b/b8/Putty_configuration...
Berkat fork kecil dan konyol ini, penggunaan SSH naik dari sekitar 5% menjadi praktis 100%, menggantikan Telnet
Terima kasih kepada Simon karena memakai lisensi yang memungkinkan hal semacam ini terjadi
Bagian “menulis kode yang menggambar semua komponen dari tiap gambar ikon secara programatis” adalah contoh yang sangat baik tentang cara Simon mendekati masalah
Pada tahun 2000-an saya menghabiskan cukup banyak waktu bersama Simon dan bisa belajar banyak hal tentang berbagai topik; pendekatan seperti ini benar-benar terasa sangat khas dirinya
Saya jadi teringat bahwa pada masa itu tampilan ikon default di Windows menjadi 48×48, bukan 32×32, sementara MacOS menginginkan ikon 128×128 di Dock
Salah satu alasan paling dangkal, tetapi sekaligus paling kuat, saya pindah dari Windows ke Mac OS X pada masa itu adalah ikon 128×128
Ikon yang menjadi titik masuk aplikasi di Finder atau Dock terlihat jauh lebih menarik dan secara naluriah terasa lebih indah
Terutama ikon aplikasi Windows sering kali memakai warna lebih sedikit dibanding ikon aplikasi Mac
Tentu ada beberapa alasan untuk beralih, tetapi saat pertama melihat desktop Mac, ikonnya memberi kesan yang cukup kuat hingga membuat saya ingin melihat lebih dalam
Hampir tidak ada orang yang tampak peduli membuat ikon yang layak
Ada yang tidak memperbarui ikon meski ukuran default berubah menjadi 48×48 sehingga menjadi buram karena diperbesar, dan ada juga yang memang menyertakan semua ukuran tetapi hanya mengecilkan gambar yang terlihat bagus pada ukuran besar
Akibatnya, pada ukuran ikon yang umum, semua detailnya melebur dan menjadi berantakan
Karena tidak ingin melihat ikon jelek di desktop atau taskbar, saya sering membuat ikon kustom sendiri dan mengganti ikon di dalam executable dengan resource editor
Ada sesuatu yang hilang ketika beralih dari bitmap ke SVG
Tekstur kasar bitmap punya pesona tersendiri
Kita tidak bisa begitu saja memindahkannya 1:1 lalu mengharapkan hasil yang bagus. Lagi pula pada praktiknya juga bukan 1:1, dan di SVG garis luarnya menjadi jauh lebih tipis
Pada gambar beresolusi rendah, imajinasi mengisi celah-celahnya
Semakin tinggi resolusinya, semakin tinggi pula kualitas yang dibutuhkan. Vector art, menurut definisinya, punya resolusi tak terbatas
Saya menduga ikon topi “Agent” terinspirasi dari Forté Agent, yang menurut saya adalah perangkat lunak Usenet paling populer untuk Windows
Motifnya sangat mirip: https://archive.org/details/forte-agent-1.6
Menyenangkan bisa membaca sejarah seperti ini langsung dari orang yang membuatnya
Bahkan dalam versi modern tahun 2014, ada detektif film noir di posisi yang sama, dan ikon aplikasinya masih berupa perempuan bertopi: https://youtu.be/h-_UNm_gycU?t=94
Saya tidak tahu tautan resmi yang mendokumentasikan ini, tetapi kalau mencari gambar di https://www.google.com/search?q=spy+vs+spy&udm=2, Anda bisa melihat banyak gambar yang menjadi inspirasi topi ini