Les météores de Netscape

 (erynwells.me)
2 points par GN⁺ 2023-08-04 | 1 commentaires | Partager sur WhatsApp
  • La recherche de l’animation de chargement originale « meteors » de Netscape Navigator, liée aux souvenirs d’enfance du web, s’est poursuivie pendant plusieurs jours, et la taille de référence de l’original était de 60×60 px
  • Les versions candidates trouvées sur le web différaient de l’original ; en particulier, la version en 400×400 px était bien trop grande et ses pixels déformés en rectangles la rendaient peu fiable
  • Même après avoir vérifié le miroir GitHub de Netscape 5.0 et les anciennes archives sources sur le FTP de Mozilla, le fichier d’animation avait déjà été supprimé
  • Après avoir demandé de l’aide sur Mastodon, un ami a identifié Jamie Zawinski, et c’est sur une page qu’il a envoyée que l’original a pu être retrouvé
  • L’original comportait un petit artefact à gauche de l’image 10, et des versions corrigées en 60×60 px et 240×240 px ont été créées en l’ajustant aux pixels environnants

Comment l’original de l’animation Netscape a été retrouvé

  • L’objectif était de retrouver l’original de l’animation « meteors » de Netscape Navigator
    • Pour l’auteur, cette animation était fortement liée aux souvenirs d’enfance de la découverte du web
    • La taille d’origine était de 60×60 px
  • Plusieurs versions candidates ont été trouvées via des recherches sur le web, mais elles ne suffisaient pas pour être considérées comme l’original
    • Une version était en 400×400 px, donc beaucoup trop grande
    • À cause d’un redimensionnement incorrect, les pixels avaient été déformés en rectangles
  • L’exploration des archives sources n’a pas donné de résultat immédiat

La réponse de Jamie Zawinski et les versions corrigées

  • Après avoir demandé de l’aide sur Mastodon, un ami a identifié @jwz pour lui demander s’il possédait encore le fichier
  • Jamie Zawinski a répondu lui-même, et c’est sur la page qu’il a envoyée que l’animation de chargement Netscape meteors a pu être retrouvée
    • Jamie Zawinski a participé à plusieurs projets logiciels dans les années 1990, dont Netscape Navigator
    • Il crée et maintient Xscreensaver et gère aujourd’hui le DNA Lounge à San Francisco
  • L’original retrouvé comportait un petit artefact à gauche de l’image 10
    • Cette zone s’affichait comme des pixels rouges et orange
    • L’auteur a créé une version corrigée en remplaçant ces pixels par d’autres mieux adaptés à ceux autour
  • Les versions corrigées ont été réalisées en 60×60 px ainsi qu’en plus grand format 240×240 px

À lire aussi

1 commentaires

 
GN⁺ 2023-08-04
Avis sur Hacker News

  • J’ai pu extraire les animations de Netscape Communicator récupéré sur winworldpc.com avec une procédure assez simple : binwalk -e cc32d48.exe, cd _cc32d48.exe.extracted, unshieldv3 extract comm.z comm, python extract_images.py --ico --png -d ns/ ~/Downloads/Netscape/_cc32d48.exe.extracted/comm/program/*.dll --continue-on-errors
    Ici, extract_images.py est un outil du projet https://github.com/akx/res-extract. Je l’avais fait il y a longtemps pour quelqu’un qui avait besoin d’icônes Excel 95
    Cela dit, le résultat n’était pas les superbes 60x60 montrées dans l’article, seulement des frames 32x32 : https://i.imgur.com/sXcEEDU.png

    • Sur mobile, il est presque impossible de voir l’image réelle sur la page imgur. Je ne cherche pas à râler, mais il y a une énorme pub Futurama en haut, du contenu sponsorisé en bas, et l’image en question n’occupe qu’environ 3 % de l’écran, ce qui est un peu hallucinant. Bien sûr, c’est aussi parce que l’image ne fait que 30 px de haut
    • Puisqu’il est question de « quelqu’un avait besoin d’icônes Excel 95, alors je les lui ai faites », j’aimerais aussi mentionner reshacker.exe : http://www.angusj.com/resourcehacker/
      Ado, j’ai passé beaucoup de temps avec ça à modifier les graphismes de Windows. Par exemple en changeant l’écran de chargement de Windows ou l’image de l’écran d’arrêt du PC ; c’était une époque amusante
    • Comme son nom peut le laisser deviner, il s’agit de la version Netscape Communicator, plus tardive, plus voyante et plus colorée que celle abordée dans l’article. On l’appelle souvent « Netscape 4 » ; son UI était plus dorée et plus « détaillée »
      L’article semble probablement parler de l’animation de Netscape Navigator version 3, c’est-à-dire « Netscape 3 »
      Navigator : https://duckduckgo.com/?q=netscape+navigator&t=h_&iar=images...
      Communicator : https://duckduckgo.com/?q=netscape+communicator&t=h_&iar=ima...
    • Maintenant je me demande combien de versions de l’animation de météore il y a eu au total
      Il y a ici une animation contenant seulement la partie en boucle. La première frame est exclue : https://i.ibb.co/DMDBR7L/Netscape-Communicator-Meteor-Loop.g...

  • Les archives du site Dataglyph (Marsh Chamberlain) contiennent d’autres versions de cette animation : https://web.archive.org/web/20011214155044/http://dataglyph....
    Une version plus ancienne du site indique aussi que Dataglyph a créé l’icône de boussole rotative, une icône non utilisée : https://web.archive.org/web/19981206034010/http://www.datagl...

    • Je me demande comment on arrive à retrouver ce genre de choses

  • Tout est ici. Il n’y a pas que ceux de Netscape 4 : http://www.netscape-communications.com/netscapes-throbber-an...

    • Maintenant que le site est de nouveau en ligne, je ne suis pas sûr que ce soit vraiment tout. Celui de l’article original ne semble pas y être. Celui de l’article ne semble pas non plus être Netscape 4 et, d’après [1], ce que l’auteur cherchait semble plutôt être Netscape 1, c’est-à-dire ce qu’il appelle « original Netscape Navigator »
      Et l’image de [1] porte des traces de modification. Elle a une bordure blanche, il semble manquer quelques-unes des dernières frames, et la palette ne correspond pas parfaitement. En revanche, la palette de l’article original restitue exactement l’atmosphère de l’époque, ce qui renforce encore le propos du billet
      [1] : https://www.versionmuseum.com/history-of/netscape-browser
    • C’est ironique que quelqu’un ait passé du temps à recréer dans un billet de blog un petit fragment de quelque chose que des milliers de personnes avaient vu. Ça donne l’impression d’une époque où l’information était dispersée en îlots
    • On dirait que ce site n’a pas résisté au trafic de HN. Le billet de blog, lui, est toujours accessible
    • NCSA Mosaic était le meilleur. Surtout quand il tournait sous SunOS, ça me manque

  • Cette combinaison de dithering et de palette quantifiée évoque incroyablement bien cette époque

    • Ça faisait vraiment longtemps que je n’avais pas repensé aux couleurs web-safe
    • Dans l’exemple de comparaison côte à côte tout en bas, le rouge tramé est particulièrement intéressant

  • Ah, l’icône de Netscape Navigator. De chaleureux souvenirs. La palette de couleurs du site et du navigateur Netscape était belle et apaisante
    Quand le météore bougeait, on savait qu’on était connecté à Internet ; s’il ne bougeait pas, il fallait rappeler plus tard

  • C’est évidemment un peu drôle à dire, mais IE 3 et 4 ont toujours « paru » plus rapides que Netscape à cause de la vitesse des animations
    Je me suis toujours demandé si Microsoft les avait volontairement rendues plus rapides pour jouer sur cette perception

    • Il y a clairement une différence. L’équipe Facebook a remplacé le loader de démarrage de son app iOS, les barres façon Facebook |||||, par le spinner iOS standard, parce que les utilisateurs avaient l’impression que Facebook était lent avec le loader Facebook, et que l’iPhone était lent avec le spinner iOS
    • Ce n’est pas du tout une histoire drôle, c’est plutôt de la psychologie humaine. J’ai lu il y a longtemps qu’on perçoit quelque chose comme plus rapide s’il montre une réaction, même si c’est en réalité plus lent
      Pour tester vous-même, créez dans votre langage préféré une appli avec 3 boutons. Le premier attend 9 secondes puis affiche « done » ; le deuxième met à jour une barre de progression toutes les secondes pendant 10 secondes, puis affiche « done » ; le troisième met à jour une barre de progression toutes les 100 ms pendant 10 secondes, puis affiche « done ». Regardez lequel donne l’impression d’être le plus rapide
    • J’aimerais étudier ça. Ce serait intéressant d’aligner le timing des changements d’UI selon la présence ou non d’un spinner/loader saccadé ou qui rame, et de comparer la perception des utilisateurs
      Quand il y a une sensation de fluidité, on a l’impression que la machine est bien programmée et bien rangée, alors qu’une animation GIF lente donne l’impression que quelque chose ne va pas
    • Tu parles de l’icône avec les nuages qui bougent derrière le logo Windows ? Sur mon portable, la vitesse était absurdement élevée, on aurait dit que les nuages se déplaçaient à vitesse de distorsion. Je ne me souviens pas si c’était IE 3, mais ça m’a toujours paru bizarre
      Édit : c’était IE 2
    • Les premières versions d’IE étaient vraiment rapides et riches en fonctionnalités. L’exécutable était aussi assez petit

  • Ça touche pile la corde de la nostalgie. C’était vraiment une bonne époque pour rejoindre le World Wide Web

    • C’était l’époque d’un web pur, sans toutes sortes d’ornements
      Puis Netscape a créé JavaScript, qui s’appelait au début Mocha/LiveScript, et on a fini par arriver à ce que l’on connaît aujourd’hui
    • Ça m’a aussi rappelé l’un de mes premiers projets de programmation. Mon professeur avait créé un jeu de vaisseau spatial pour Netscape, et je l’ai porté vers le modèle d’UI d’IE
      À l’époque, il n’y avait pas de DOM standardisé et, dans mon souvenir, forcer les incompatibilités faisait partie de la stratégie de Microsoft

  • Je vais déposer ici une pile de .net et de magazines Wired ; il ne reste plus qu’à écouter le bruit de handshake du modem

    • Il ne faut pas oublier non plus le magazine « Yahoo! Internet Life »

  • Quelqu’un sait par quel procédé l’animation originale a été créée ? Je me demande si chaque frame a été dessinée à la main, ou si une autre technique a été utilisée

    • J’imagine que les frames ont été dessinées directement, mais à l’époque il existait aussi des outils pour convertir des ANI en GIF
      Elle a donc pu être réalisée dans 3D Studio Max ou Maya de SGI, voire Lightwave sur Amiga, puis passer par .ANI avant d’arriver en .GIF
      Dans ce cas, il existe peut-être un chemin pour exhumer les fichiers de projet originaux et produire un superbe rendu 8K
    • Ça devait ressembler à ce genre de workflow bricolé. L’animation de base et le rendu d’éclairage ont probablement été faits avec quelque chose comme Autodesk 3D Studio R3/R4 (DOS) ou Lightwave 3D (Amiga), car le faire à la main aurait été infernal
      Ensuite, il a sans doute fallu un mélange de logiciel maison pour l’optimisation de palette, de Photoshop sur Mac pour la composition, et de retouches manuelles frame par frame. L’ordre n’était pas forcément celui-là
      3ds Max est sorti en 1996, Maya en 1998. Cela dit, Netscape ayant été fondée par Jim Clark, célèbre pour SGI, il est très probable que le travail 3D ait été fait avec un logiciel tournant sur des machines SGI
    • C’était une image bitmap où les frames individuelles étaient alignées horizontalement. C’était une façon courante de produire ce genre d’animations GIF, nombreuses et populaires sur le web pendant un temps : http://leighb.com/throbgif.htm

  • C’était une époque où Internet donnait l’impression que n’importe qui pouvait acheter chez Borders Bookstore un livre de 15 cm d’épaisseur, s’asseoir pour le lire, apprendre le HTML, puis se lancer aussitôt et en faire une carrière
    C’est littéralement ce que j’ai fait, et au début j’utilisais le programme intégré à Netscape