1 pontos por GN⁺ 2024-06-27 | 1 comentários | Compartilhar no WhatsApp
  • HyperCard Simulator é um simulador baseado na web que permite importar e executar stacks clássicos do HyperCard na web moderna
  • Os stacks funcionam como um conjunto ordenado de cartões; é possível adicionar e excluir cartões e também compartilhá-los online por meio de uma conta
  • Nos cartões, é possível colocar botões e campos; elementos criados no plano de fundo podem ser aplicados repetidamente a vários cartões, mantendo textos separados por cartão
  • A edição é feita diretamente sobre o cartão, com suporte a pintura simples usando lápis, balde de tinta e padrões em preto e branco ou transparentes
  • Pode ser usado sem scripts, mas a message box e o Script Editor permitem trabalhar com comandos xTalk e handlers de mensagens como mouseUp

Stacks do HyperCard rodando na web

  • HyperCard Simulator permite importar stacks clássicos do HyperCard e executá-los no navegador
  • O criador pede desculpas aos autores do HyperCard e diz que fez o projeto no tempo livre para ver como o HyperCard funcionaria na web moderna
  • Como recursos relacionados, há links para hypercard.org, Merveilles HyperJam e Internet Archive
  • Como opções para explorar mais stacks, são oferecidos More stacks, A Few More Stacks, The "B–Roll", Collected Stacks, Lots More Stacks e The HyperCard Pantechnicon

Modelo de edição centrado em cartões e planos de fundo

  • Um stack do HyperCard é parecido com um baralho de cartões folheado em ordem, e o usuário pode adicionar ou remover cartões do stack
  • O HyperCard salvava stacks automaticamente; neste simulador, é possível criar uma conta e compartilhá-los online
  • Cada cartão pode conter botões e campos
    • Depois de selecionar a ferramenta adequada, a edição é feita arrastando e redimensionando
    • Botões e campos podem ser criados no cartão ou no plano de fundo
    • As propriedades podem ser abertas com duplo clique ou toque longo
  • As partes do plano de fundo são aplicadas repetidamente a vários cartões
    • Cada cartão pode ter suas próprias partes e textos
    • Cada cartão tem um único plano de fundo, que é uma camada atrás de um grupo de cartões
    • Em cada cartão que usa o mesmo plano de fundo, é possível ter textos específicos do cartão dentro dos campos do plano de fundo

Pintura e scripting

  • A pintura é feita diretamente sobre o cartão
    • É possível usar o lápis ou o balde de tinta
    • Preto é usado com Shift, branco com Option, e transparente com o padrão Option+Shift
  • Scripting não é obrigatório, mas é possível aprender observando os scripts do próprio simulador
    • A message box avalia expressões e comandos xTalk
    • O Script Editor pode ser aberto pela caixa de diálogo Information ou acessado com Command-Option-click, toque longo ou duplo clique segurando Shift
    • Scripts podem receber mensagens enviadas pelo usuário e executar ações como beep ou go next card
    • Um exemplo de handler de mensagem executa beep em on mouseUp, vai para o próximo cartão e termina com end mouseUp

1 comentários

 
GN⁺ 2024-06-27
Opiniões no Hacker News
  • Fico um pouco triste que o HyperCard tenha vindo antes da minha geração. Se eu o tivesse conhecido quando criança, acho que não teria feito mais nada; mexendo nele em um emulador, achei bem divertido.
    Gosto dessas primeiras tentativas de tornar a programação mais acessível às pessoas. Em uma escala bem menor, a ferramenta de animação do Flash me deu uma sensação parecida quando usei pela primeira vez: era muito mais fácil chegar direto ao ponto do que tentar juntar OpenGL ou SDL com C++, e criar coisas era simplesmente divertido. Depois do Flash, não encontrei nenhuma ferramenta de desenvolvimento tão divertida assim; o GameMaker também é legal e ainda é divertido, mas não é tão fluido quanto o Flash nem dá tanto aquela sensação de “dá para fazer qualquer coisa”. Talvez eu só tenha envelhecido

    • Ainda acredito que o HyperCard seja o ambiente de desenvolvimento mais produtivo da história para criar apps de usuário final
    • E também havia o Macromedia Director. Hoje em dia, apaixonar-se por um software virou algo realmente raro
    • Se você está procurando algo digital e interativo fácil, talvez goste do p5.js. https://p5js.org/
      O Flash desapareceu mais rápido do que surgiram substitutos; quando ele sumiu, era muito claro que, se o HTML5 da época fosse o futuro e o substituto imediato, estávamos ferrados. Se você estiver procurando a próxima ferramenta para criar alguma coisa, o Flutter parece levar adiante a promessa do Flash de rodar em qualquer lugar com uma única base de código. Outras tecnologias em que aposto são WebAssembly e, em certa medida, Rust
    • Dê uma olhada em P5js e Processing; talvez eles ajudem a matar um pouco essa vontade
  • A forma como o cursor vira um ícone de mão quando você passa o mouse sobre um link foi diretamente inspirada no HyperCard. Em muitos aspectos, o navegador pode ser visto como uma evolução das stacks do HyperCard

    • Fico me perguntando se a Web ainda teria surgido se o HyperCard tivesse rede integrada
  • Quando eu era criança, HyperCard e SuperPaint eram meus Lego. Meu pai era um cientista que precisava de um Macintosh para fazer cálculos, então eu era uma das pouquíssimas crianças da época cuja família tinha um computador.
    Criei muitos pequenos dispositivos no HyperCard, e tenho muito carinho pelo jeito divertido como ele criava padrões usando apenas apps em monitor preto e branco e cores monocromáticas

    • Foi parecido comigo. Meus pais eram professores, e meu pai cuidava do laboratório de Macs, embora não fosse particularmente habilidoso com Mac. Mesmo assim, no verão, os computadores ficavam parados, então ele podia levar um para casa; primeiro usei um Apple IIe e depois um Mac antigo. Passei tempo demais brincando no HyperCard.
      Meu primeiro computador, um Apple II GS, também pôde ser comprado por professores com um grande desconto por meio do programa “Apple for a Teacher”. Era uma máquina meio precursora do Mac com monitor colorido. Ganhei como prêmio 5 jogos à minha escolha em um concurso de escrita criativa da revista 3-2-1 Contact, e consegui convencer meus pais de que precisava de um computador para jogar esses jogos pelo resto do período
  • Observação: se você clicar na caixa de maximizar janela no canto superior direito, ele dá zoom out para o HyperCard Editor.
    Ainda estou descobrindo como começar a partir de um deck vazio, e minhas habilidades estão claramente enferrujadas. Também fico curioso para saber até que ponto seria viável criar um site inteiro baseado em HyperCard com isso

    • Há um “New Stack...” no menu hambúrguer.
      Também dá para fazer login.
      https://hcsimulator.com/mmphosis/Stack
    • Você pode criar um novo cartão e criar botões que levem ao próximo cartão ou a qualquer ponto de uma pilha linear de cartões. Dá para lidar com transições, efeitos e temporização em um editor gloriosamente pixelado
  • Da perspectiva de quem era jovem demais para ter vivido a era do HyperCard, fico curioso sobre qual era o principal encanto. Era a acessibilidade da tecnologia, ou era simplesmente um produto muito bem executado?

    • Eram as duas coisas. O HyperCard colocava o poder da GUI nas mãos do usuário com metáforas e sintaxe simples. A linguagem era parecida o bastante com o inglês para parecer fácil de escrever, mas não a ponto de fazer você se iludir achando que poderia fazer coisas que, na prática, ela não fazia. Lembra o Inform 7.
      Como o código era anexado visualmente aos widgets, ficava claro que, ao clicar em um botão ou digitar em um campo de texto, aquele trecho de código produzia aquela ação. Além disso, o ambiente do HyperCard também implementava persistência de objetos, então era útil por não exigir que você escrevesse código de manipulação de arquivos ou uma função de “salvar estado”. Claro que, por causa dessa semântica, se você estragasse uma pilha, podia ser difícil encontrar e corrigir a causa, mas, no geral, acho que a persistência transparente de objetos era uma grande vantagem.
      E, se você tinha um Mac, ele estava literalmente ali. A Apple o vendeu por um breve período como produto independente de US$ 49,95 e depois passou a incluí-lo em todos os Macs novos por cerca de 10 anos. Se era um Mac com System 6, 7, 8 ou 9, ele tinha HyperCard, e ele também foi incluído no Apple IIGS naquele período. Apesar das limitações, lembro de ter visto apps bastante não triviais implementados em HyperCard.
      Acima de tudo, o HyperCard tornou a computação pessoal novamente pessoal de uma forma que havia se perdido desde a época em que os computadores inicializavam direto em um interpretador BASIC, e isso foi algo muito bom. Se essa explicação não for suficiente, veja este trecho: http://www.cvxmelody.net/HyperCard%20IIGS%201.1%20-%20The%20...
    • No 5º ano, o HyperCard foi para mim algo como desenvolvimento de software inicial. Eu passava horas depois da escola criando jogos e aventuras de escolha, e conseguia colocar instruções goto, loops, animações e funções simples como “ao clicar, toque este som e vá para esta página”. Fiquei completamente absorvido, e provavelmente isso levou à minha paixão por desenvolvimento em BBS.
    • Era antes mesmo de existirem a web ou o Flash. Era uma ferramenta de criação multimídia/interativa relativamente simples para não programadores, com layout WYSIWYG. Dava para fazer de tudo no HyperCard, desde formas de interagir com bancos de dados até histórias escolares para crianças.
    • Quando tive o primeiro contato com o conceito de cartões conectados no HyperCard, ou seja, hipertexto, foi algo que explodiu minha cabeça. Acho que, para muita gente, foi também a primeira introdução ao hipertexto, mesmo que elas não tenham percebido. Era o Adobe Flash daquela época.
    • Também acho.
      Era uma linguagem meio parecida com Smalltalk, bem feita, com um componente RAD que, ainda que limitado, reduzia a criação de GUIs a uma complexidade parecida com a de usar PowerPoint. Dava para entregar a uma criança “esperta” e, com pouquíssima explicação, ela conseguia criar pelo menos ficção interativa. A grande maioria das pilhas do HyperCard podia ser vista como decks de slides não lineares de PowerPoint: cartões em que botões chamavam instruções goto para pular para outros cartões.
  • Eu era criança nos anos 90 e tenho lembranças vagas de vários joguinhos e programas que rodavam no Mac da família. Meu primeiro Mac provavelmente foi um Mac SE. Pensando agora, eles provavelmente eram programas em HyperCard.
    Havia algo como um livro ilustrado interativo sobre um gato preto; esqueci o nome, mas sei que está no Macintosh Garden e tenho 99% de certeza de que era HyperCard. Meu pai me deu um programa chamado Soroban, que basicamente era um ábaco, e acho que ele apresentava probleminhas simples de aritmética para você calcular no ábaco e descobrir a resposta. Talvez meu pai o tenha escrito, mas não tenho certeza. Infelizmente, hoje não me lembro mais de como usar um ábaco. Fico curioso para saber quais eram aqueles programas pouco conhecidos em HyperCard com que me deparei naquela época.

  • Vale conferir: Carson Gross criou _hyperscript[0], uma linguagem inspirada no HyperCard e interpretada no navegador.
    O mesmo Carson Gross também criou o htmx[1]. Os dois são projetos separados, mas combinam bem.
    [0]https://hyperscript.org/
    [1]https://htmx.org/

  • Nossa, aqui tem uma pilha que eu criei 30 anos atrás! Infelizmente, ela não funciona direito no simulador.

    • Fiquei curioso para saber qual pilha é. Se quiser mexer nela por nostalgia, ainda existem outras formas de executá-la hoje em dia, e o criador do HC Simulator também costuma responder bem rápido para corrigir coisas que não funcionam direito.
  • Há uma pergunta que continua me incomodando. Qual ferramenta moderna hoje faz exatamente o que o HyperCard fazia na época? Seria HTML/JavaScript?

    • Não vejo HTML/JavaScript como uma “ferramenta” no mesmo sentido que o HyperCard
      O verdadeiro ponto forte do HyperCard era permitir que usuários comuns, ou seja, pessoas que não eram programadoras, criassem seus próprios apps — “stacks”, na terminologia do HyperCard — por meio de apontar e clicar e de uma linguagem de script parecida com inglês, o HyperTalk
      Em geral, abandonamos a ideia de que usuários deveriam poder criar seus próprios apps, então não há um análogo moderno popular equivalente ao HyperCard. Ainda assim, há pessoas que continuam tentando. Por exemplo, o LiveCode é um produto comercial diretamente inspirado no HyperCard, e o CardStock é um clone open source do HyperCard que usa Python como linguagem de script padrão em vez de uma linguagem parecida com inglês
      https://livecode.com/
      https://github.com/benjie-git/CardStock
    • Muita gente já fez essa pergunta. Há várias ferramentas simples de criação de GUIs, incluindo construtores de GUI para a web, mas nenhuma se populariza por causa do ponto exato entre oferta e demanda que o HyperCard acertou
      Quando o HyperCard foi lançado, ele vinha incluído em todos os Macs, era gratuito e não havia nada parecido no Mac. As alternativas eram posicionar widgets de UI via código, sem um construtor de GUI, ou, mais tarde, pagar caro por uma IDE profissional como o CodeWarrior. Se um usuário iniciante sem orçamento quisesse um construtor de GUI para Mac, ou usava o HyperCard ou não usava nada; foi isso que criou a comunidade de entusiastas do HyperCard
      Além disso, os Macs da época tinham uma resolução de tela padrão. Todos os Macs vendidos tinham resolução de 512x342 pixels, então era possível saber com certeza como um cartão apareceria em qualquer Mac. Dar suporte a GUIs redimensionáveis é uma das coisas mais difíceis em qualquer construtor de GUI. Isso por causa de questões como onde colocar botões quando a tela fica muito pequena, como em um telefone, ou muito larga, como em um monitor 16:9. Hoje, o Xcode usa um sofisticado solucionador de restrições/provador de teoremas para permitir que desenvolvedores criem UIs redimensionáveis na GUI, e acho que funciona bastante bem, mas nunca pode ser tão fácil de aprender quanto “arraste um botão para a tela e ele vai aparecer exatamente assim em qualquer lugar”
      O último motivo realmente fatal para as ferramentas modernas que aspiram ser o HyperCard é que, em um construtor de GUI para a web, a distância até o HTML/CSS puro é curta. Não é preciso pagar caro para ter acesso a HTML, CSS e JavaScript de nível profissional. Não é fácil de aprender, mas dá para ensinar uma criança a escrever páginas web interativas sem problema
      Por isso, a demanda por construtores de GUI simples é menor do que na época do HyperCard; mesmo quando eles retêm usuários, esses usuários tendem a “se formar” no produto em pouco tempo; e a concorrência é enorme, o que torna difícil para qualquer ferramenta criar uma comunidade com tração real
    • O HyperCard era mais limitado, e essa limitação servia para forçar soluções criativas. Ao mesmo tempo, em termos de acessibilidade, ele superava em muito HTML/JS. Ainda assim, talvez a analogia mais próxima seja HTML/JS
      Mesmo se limitarmos só ao HTML, a diversão de criar fica muito aquém da do HyperCard
    • Um exemplo é este: https://internet-janitor.itch.io/decker
      Basicamente, ele também parece um pouco com o HyperCard. Tem uma sensação de baixa resolução, mas por dentro também há cores
    • Na minha opinião, essa ferramenta não existe. Não porque hoje não exista uma ferramenta que faça algo “parecido” com o que o HyperCard fazia, mas porque não existe mais um ambiente de computação pessoal no qual uma ferramenta dessas se encaixe de forma tão natural e essencial
      O HyperCard surgiu numa época em que usuários de computadores pessoais ainda estavam aprendendo o que era usar um computador. Aquele era justamente o momento em que a programação pelo usuário final e sistemas maleáveis como o HyperCard poderiam ter liderado. Algo semelhante pode ser dito, em certa medida, sobre o OpenDoc, mas é um pouco diferente
      Do ponto de vista empresarial, o que exatamente era o HyperCard? Uma forma de permitir que usuários de computador simplesmente criassem seus próprios apps básicos? Então como continuar ganhando dinheiro? O que aconteceria com a comunidade de desenvolvedores do computador? Por causa dessas preocupações comerciais, hoje tanto a forma como os usuários se envolvem com a computação pessoal quanto as ferramentas com que manipulamos os ambientes de computação são fortemente definidas por um modelo de consumo, e existe uma separação forte entre usuário e programador
      O motivo de não haver hoje um equivalente real ao HyperCard é que a computação pessoal seguiu em outra direção
  • Como isso se compara ao Decker?
    https://beyondloom.com/decker/index.html

    • O HyperCard Simulator é um serviço centralizado baseado na web que busca compatibilidade com stacks históricos do HyperCard e com a linguagem de script HyperTalk
      O Decker é um app independente open source que, em alguns aspectos, se parece com o HyperCard, mas é bem diferente nos detalhes, como no uso de uma linguagem de script própria derivada de APL. O Decker não foi projetado para ser compatível com stacks do HyperCard
    • Ainda não tive a oportunidade de sentar e usar este simulador de verdade, mas, como alguém que já usou tanto o Decker quanto o HyperCard, o Decker tem uma curva de aprendizado muito mais íngreme para iniciantes