Simulateur HyperCard

 (hcsimulator.com)
1 points par GN⁺ 2024-06-27 | 1 commentaires | Partager sur WhatsApp
  • HyperCard Simulator est un simulateur web permettant d’importer et d’exécuter des stacks HyperCard classiques dans le web moderne
  • Une stack fonctionne comme un jeu de cartes ordonné, où l’on peut ajouter ou supprimer des cartes et les partager en ligne via un compte
  • Les cartes peuvent contenir des boutons et des champs, et les éléments créés dans l’arrière-plan peuvent être réutilisés sur plusieurs cartes tout en conservant un texte distinct pour chaque carte
  • L’édition se fait directement sur la carte, avec une prise en charge simple du dessin grâce au crayon, au pot de peinture et à des motifs noir et blanc ou transparents
  • L’outil peut être utilisé sans script, mais la message box et le Script Editor permettent de manipuler les commandes xTalk et des gestionnaires de messages comme mouseUp

Des stacks HyperCard qui s’exécutent sur le web

  • HyperCard Simulator permet d’importer des stacks HyperCard classiques et de les exécuter dans le navigateur
  • Son créateur présente ses excuses aux créateurs de HyperCard et explique l’avoir conçu sur son temps libre pour voir comment HyperCard fonctionnerait dans le web moderne
  • Parmi les ressources liées figurent hypercard.org, Merveilles HyperJam et Internet Archive
  • Pour explorer davantage de stacks, les sections More stacks, A Few More Stacks, The "B–Roll", Collected Stacks, Lots More Stacks et The HyperCard Pantechnicon sont proposées

Un modèle d’édition centré sur les cartes et les arrière-plans

  • Une stack HyperCard ressemble à un jeu de cartes que l’on parcourt dans l’ordre, et l’utilisateur peut y ajouter ou retirer des cartes
  • HyperCard sauvegardait automatiquement les stacks, et ce simulateur permet de créer un compte et de les partager en ligne
  • Chaque carte peut contenir des boutons et des champs
    • L’édition se fait après avoir sélectionné l’outil approprié, puis par glisser-déposer et redimensionnement
    • Les boutons et les champs peuvent être créés sur la carte ou dans l’arrière-plan
    • Leurs propriétés peuvent être ouvertes par double-clic ou appui long
  • Les parties d’arrière-plan sont réutilisées sur plusieurs cartes
    • Chaque carte peut avoir ses propres parties et son propre texte
    • Chaque carte possède un arrière-plan, qui est une couche située derrière le groupe de cartes
    • Pour les cartes utilisant le même arrière-plan, il est possible d’avoir un texte propre à chaque carte dans les champs d’arrière-plan

Dessin et scripting

  • Le dessin s’effectue directement sur la carte
    • On peut utiliser le crayon ou le pot de peinture
    • Le noir s’utilise avec Shift, le blanc avec Option, et la transparence avec le motif Option+Shift
  • Le scripting n’est pas obligatoire, mais on peut apprendre en consultant les scripts du simulateur lui-même
    • La message box évalue les expressions et les commandes xTalk
    • Le Script Editor peut être ouvert depuis la boîte de dialogue Information, ou via Command-Option-click, touch-hold, ou un double-clic en maintenant Shift
    • Les scripts peuvent recevoir des messages envoyés par l’utilisateur et exécuter des actions comme beep ou go next card
    • Un exemple de gestionnaire de messages exécute beep dans on mouseUp, passe à la carte suivante, puis se termine par end mouseUp

À lire aussi

1 commentaires

 
GN⁺ 2024-06-27
Avis de Hacker News

  • Je trouve un peu dommage que HyperCard ait précédé ma génération. Si je l’avais connu enfant, je crois que je n’aurais rien fait d’autre, et en l’essayant via un émulateur, je l’ai trouvé assez amusant.
    J’aime ces premières tentatives visant à rendre la programmation facilement accessible. Dans une bien moindre mesure, quand je l’ai utilisé pour la première fois, l’outil d’animation Flash m’a donné une impression similaire : il était beaucoup plus immédiatement abordable que d’essayer de brancher OpenGL ou SDL en C++, et créer quelque chose était tout simplement amusant. Depuis Flash, je n’ai pas trouvé d’outil de développement qui m’ait autant amusé ; GameMaker est excellent et reste fun, mais il est moins fluide que Flash et donne moins cette impression que « tout est possible ». Peut-être que je vieillis, tout simplement.

    • Je crois encore que HyperCard reste l’environnement de développement le plus productif de l’histoire pour créer des apps destinées aux utilisateurs finaux.
    • Et il y avait aussi Macromedia Director. De nos jours, tomber amoureux d’un logiciel est devenu vraiment rare.
    • Si vous cherchez quelque chose de facile pour faire de l’interactif numérique, p5.js pourrait vous plaire. https://p5js.org/
      Flash a disparu plus vite que ses remplaçants ne sont apparus, et quand Flash a disparu, il était très clair que si le HTML5 de l’époque était à la fois l’avenir et son remplaçant immédiat, nous étions mal partis. Si vous cherchez le prochain outil pour créer quelque chose, Flutter semble reprendre la promesse de Flash : une seule base de code qui s’exécute partout. Les autres technologies sur lesquelles je fonde des espoirs sont WebAssembly, et dans une certaine mesure Rust.
    • Jetez un œil à P5js et Processing ; cela pourrait combler un peu ce manque.

  • Le fait que le curseur se transforme en main quand on survole un lien est directement inspiré de HyperCard. À bien des égards, le navigateur peut être vu comme une évolution des piles HyperCard.

    • Je me demande si le Web aurait quand même vu le jour si HyperCard avait intégré le réseau dès le départ.

  • Enfant, HyperCard et SuperPaint étaient mes Lego. Mon père était scientifique et avait besoin d’un Macintosh pour faire tourner des calculs, donc j’étais l’un des rares enfants de l’époque dont la famille avait un ordinateur.
    J’ai créé énormément de petits dispositifs avec HyperCard, et je garde une grande affection pour ces façons amusantes de produire des motifs avec seulement une app pour écran noir et blanc et du monochrome.

    • Pareil pour moi. Mes parents étaient enseignants, et mon père s’occupait du labo Mac, sans être particulièrement à l’aise avec les Mac. Mais en été, les ordinateurs ne servaient pas, donc il pouvait en ramener un à la maison : d’abord un Apple IIe, puis plus tard un des premiers Mac. J’ai passé un temps fou à jouer dans HyperCard.
      Mon premier ordinateur, un Apple II GS, avait aussi été acheté grâce au programme « Apple for a Teacher », qui permettait aux enseignants d’obtenir de grosses réductions. C’était une sorte de précurseur du Mac avec un écran couleur. J’avais gagné 5 jeux au choix à un concours d’écriture créative du magazine 3-2-1 Contact, et j’ai pu convaincre mes parents qu’il me fallait un ordinateur pour jouer à ces jeux pendant le reste du temps.

  • À noter : cliquer sur la case d’agrandissement de la fenêtre en haut à droite fait un zoom arrière vers le HyperCard Editor.
    Je suis encore en train de comprendre comment partir d’un deck vide, et mes compétences sont clairement rouillées. Je me demande aussi dans quelle mesure il serait possible de créer avec ça tout un site web basé sur HyperCard.

    • Il y a « New Stack... » dans le menu hamburger.
      On peut aussi se connecter.
      https://hcsimulator.com/mmphosis/Stack
    • Il suffit de créer une nouvelle carte, puis de créer un bouton qui pointe vers la carte suivante ou vers l’endroit voulu dans une pile de cartes linéaire. Les transitions, les effets et le timing se règlent dans un éditeur glorieusement pixellisé.

  • Ayant été trop jeune pour connaître l’époque HyperCard, je me demande quel était son principal attrait. Était-ce l’accessibilité de la technologie, ou simplement un produit vraiment bien exécuté ?

    • C’était les deux. HyperCard mettait la puissance de l’interface graphique entre les mains des utilisateurs grâce à une métaphore et une syntaxe simples. Le langage ressemblait assez à l’anglais pour paraître facile à écrire, mais pas au point de vous faire croire que vous pouviez faire des choses qu’il ne permettait pas réellement. Ça me fait penser à Inform 7.
      Comme on attachait visuellement du code aux widgets, on comprenait clairement que tel fragment de code produisait telle action quand on cliquait sur un bouton ou qu’on saisissait du texte dans un champ. En plus, l’environnement HyperCard implémentait aussi la persistance des objets, ce qui évitait d’avoir à écrire soi-même du code de gestion de fichiers ou une fonction de « sauvegarde de l’état », et c’était utile. Bien sûr, à cause de cette sémantique, si l’on cassait une pile, il pouvait être difficile d’en trouver la cause et de la réparer, mais dans l’ensemble je pense que la persistance transparente des objets était un gros avantage.
      Et si vous aviez un Mac, il était littéralement là, prêt à l’emploi. Après l’avoir vendu brièvement comme produit autonome à 49,95 $, Apple a commencé à l’inclure avec tous les nouveaux Mac pendant environ dix ans. Si vous aviez un Mac sous System 6, 7, 8 ou 9, vous aviez HyperCard, et il était aussi inclus à cette époque avec l’Apple IIGS. Malgré ses limites, je me souviens avoir vu des apps assez non triviales réalisées avec HyperCard.
      Surtout, HyperCard a rendu l’informatique personnelle de nouveau personnelle, d’une manière qu’on avait perdue depuis l’époque où les ordinateurs démarraient directement sur un interpréteur BASIC, et c’était une très bonne chose. Si cette explication ne suffit pas, regardez cet extrait : http://www.cvxmelody.net/HyperCard%20IIGS%201.1%20-%20The%20...
    • En CM2, HyperCard était pour moi une sorte de développement logiciel précoce. Je passais des heures après l’école à créer des jeux et des aventures à choix multiples, et je pouvais y mettre des instructions goto, des boucles, des animations, des fonctions simples du genre « quand on clique, jouer ce son et aller à cette page ». J’étais complètement accro, et ça a probablement nourri ma passion pour le développement de BBS.
    • C’était avant même le Web ou Flash. C’était un outil de création multimédia/interactive relativement simple pour les non-programmeurs, avec une mise en page WYSIWYG. On pouvait créer toutes sortes de choses avec HyperCard, depuis des interactions avec des bases de données jusqu’à des histoires scolaires pour enfants.
    • Quand j’ai découvert le concept de cartes reliées dans HyperCard, c’est-à-dire l’hypertexte, ça m’a retourné le cerveau. Je pense que, pour beaucoup de gens, c’était leur première introduction à l’hypertexte, même s’ils ne s’en rendaient pas compte. C’était le Adobe Flash de son époque.
    • C’est aussi mon avis.
      C’était une sorte de langage à la Smalltalk bien conçu, avec un composant RAD qui, malgré ses limites, ramenait la création d’interfaces graphiques à une complexité comparable à celle de PowerPoint. On pouvait le donner à un enfant « malin » et, avec très peu d’explications, il pouvait au moins créer de la fiction interactive. La grande majorité des piles HyperCard pouvaient être vues comme des diaporamas PowerPoint non linéaires : des cartes où des boutons appelaient des goto pour sauter vers d’autres cartes.

  • J’étais enfant dans les années 90, et j’ai des souvenirs flous de plusieurs petits jeux et programmes qui tournaient sur le Mac familial. Notre premier Mac était probablement un Mac SE. Avec le recul, c’étaient sans doute des programmes HyperCard.
    Il y avait un livre d’images interactif sur un chat noir, dont j’ai oublié le nom, mais je sais qu’il est sur Macintosh Garden, et je suis sûr à 99 % que c’était du HyperCard. Mon père m’avait donné un programme appelé Soroban, qui était en gros un boulier : il proposait de petits problèmes d’arithmétique, et il fallait utiliser le boulier pour calculer et trouver la réponse. Il l’avait peut-être écrit lui-même, mais je n’en suis pas certain. Malheureusement, je ne me souviens plus aujourd’hui comment utiliser un boulier. Je me demande quels étaient ces programmes HyperCard peu connus que j’ai croisés à l’époque.

  • À noter : Carson Gross a créé _hyperscript[0], un langage inspiré de HyperCard et interprété dans le navigateur.
    Le même Carson Gross a aussi créé htmx[1]. Ce sont deux projets distincts, mais ils s’articulent bien ensemble.
    [0]https://hyperscript.org/
    [1]https://htmx.org/

  • Incroyable, il y a ici une pile que j’ai créée il y a 30 ans ! Malheureusement, elle ne fonctionne pas correctement dans le simulateur.

    • Je suis curieux de savoir de quelle pile il s’agit. Si vous voulez la manipuler par nostalgie, il existe encore aujourd’hui d’autres façons de l’exécuter, et l’auteur de HC Simulator réagit assez vite pour corriger ce qui ne marche pas correctement.

  • Une question continue de me trotter dans la tête. Quel outil moderne fait aujourd’hui exactement ce que faisait HyperCard à l’époque ? HTML/JavaScript ?

    • Je ne pense pas que HTML/JavaScript soit un « outil » au même sens qu’HyperCard.
      La vraie force d’HyperCard, c’était de permettre à des utilisateurs ordinaires — autrement dit, pas des programmeurs — de créer leurs propres applis, ou des « piles » dans la terminologie d’HyperCard, par pointage, clics et via HyperTalk, un langage de script proche de l’anglais.
      Comme nous avons globalement abandonné l’idée que les utilisateurs devraient pouvoir créer leurs propres applis, il n’existe pas d’équivalent moderne populaire d’HyperCard. Il y a tout de même des gens qui continuent d’essayer. Par exemple, LiveCode est un produit commercial directement inspiré d’HyperCard, et CardStock est un clone open source d’HyperCard qui utilise Python comme langage de script par défaut au lieu d’un langage proche de l’anglais.
      https://livecode.com/
      https://github.com/benjie-git/CardStock
    • Beaucoup de gens se sont posé cette question. Il existe plusieurs outils simples de construction de GUI, y compris des GUI builders pour le Web, mais aucun n’est devenu grand public, à cause du point d’équilibre particulièrement subtil entre l’offre et la demande qu’HyperCard avait trouvé.
      Quand HyperCard est sorti, il était inclus avec tous les Mac, gratuit, et rien de comparable n’existait sur Mac. Les alternatives consistaient à placer des widgets d’UI en code, sans GUI builder, ou plus tard à payer très cher un IDE professionnel comme CodeWarrior. Si un débutant sans budget voulait un GUI builder pour Mac, il utilisait HyperCard ou rien du tout, et c’est ce qui a créé une communauté de passionnés d’HyperCard.
      À l’époque, les Mac avaient aussi une résolution d’écran standard. Tous les Mac vendus avaient une résolution de 512x342 pixels, ce qui permettait de savoir avec certitude à quoi ressemblerait une carte sur n’importe quel Mac. La prise en charge d’interfaces redimensionnables est l’une des tâches les plus difficiles pour n’importe quel GUI builder, à cause de questions comme l’emplacement des boutons quand l’écran devient très petit, comme sur un téléphone, ou très large, comme sur un moniteur 16:9. Aujourd’hui, Xcode utilise un solveur de contraintes / prouveur de théorèmes sophistiqué pour permettre aux développeurs de créer des UI redimensionnables dans une GUI, et je pense que ça marche plutôt bien, mais ça ne pourra jamais être aussi facile à apprendre que « faites glisser un bouton sur l’écran et il apparaîtra exactement comme ça partout ».
      La dernière vraie raison, fatale pour les outils modernes qui aspirent à être HyperCard, c’est que la distance entre un GUI builder Web et du HTML/CSS brut est courte. Il n’est pas nécessaire de payer cher pour accéder à du HTML, CSS et JavaScript de niveau professionnel. Ce n’est pas facile à apprendre, mais apprendre à un enfant à écrire une page Web interactive ne pose pas de problème.
      La demande pour des GUI builders simples est donc plus faible qu’à l’époque d’HyperCard ; même lorsqu’ils retiennent des utilisateurs, ceux-ci ont tendance à vite « sortir » du produit ; et la concurrence est si énorme qu’il est difficile pour un outil de créer une communauté avec une vraie traction.
    • HyperCard était plus limité, et ces limites forçaient à trouver des solutions créatives. En même temps, son accessibilité dépassait de loin celle de HTML/JS. Malgré tout, l’analogie la plus proche est peut-être HTML/JS.
      Même en se limitant à HTML, le plaisir de création est très loin de celui d’HyperCard.
    • Un exemple serait celui-ci : https://internet-janitor.itch.io/decker
      Fondamentalement, ça ressemble un peu à HyperCard. L’aspect est basse résolution, mais il y a aussi de la couleur à l’intérieur.
    • À mon avis, un tel outil n’existe pas. Non pas parce qu’il n’existe aujourd’hui aucun outil qui fasse quelque chose de « similaire » à ce que faisait HyperCard, mais parce qu’il n’existe plus d’environnement informatique personnel dans lequel un tel outil s’intégrerait aussi naturellement et aussi centralement.
      HyperCard est arrivé à une époque où les utilisateurs d’ordinateurs personnels apprenaient encore ce que signifiait utiliser un ordinateur. C’était précisément le moment où la programmation par l’utilisateur final et les systèmes malléables comme HyperCard pouvaient prendre le dessus. On peut en dire quelque chose d’assez similaire à propos d’OpenDoc, même si c’est un peu différent.
      Du point de vue d’une entreprise, qu’était donc HyperCard ? Un moyen de permettre aux utilisateurs d’ordinateur de créer eux-mêmes leurs applis de base ? Alors comment continuer à gagner de l’argent ? Que devient la communauté de développeurs de l’ordinateur ? En raison de ces préoccupations commerciales, la manière dont les utilisateurs participent aujourd’hui à l’informatique personnelle, ainsi que les outils avec lesquels nous manipulons l’environnement informatique, sont fortement déterminés par un modèle de consommation, avec une séparation nette entre utilisateurs et programmeurs.
      S’il n’existe pas aujourd’hui de véritable équivalent d’HyperCard, c’est parce que l’informatique personnelle a pris une autre direction.

  • Qu’est-ce que ça donne par rapport à Decker ?
    https://beyondloom.com/decker/index.html

    • HyperCard Simulator est un service Web centralisé qui vise la compatibilité avec les piles HyperCard historiques et avec le langage de script HyperTalk.
      Decker est une application autonome open source qui ressemble à HyperCard par certains aspects, mais qui diffère beaucoup dans les détails, notamment parce qu’elle utilise son propre langage de script dérivé d’APL. Decker n’a pas été conçu pour être compatible avec les piles HyperCard.
    • Je n’ai pas encore eu l’occasion de m’asseoir pour vraiment utiliser ce simulateur, mais pour avoir utilisé à la fois Decker et HyperCard, Decker a une courbe d’apprentissage beaucoup plus raide pour les débutants.