SimCity rodando no navegador com WebAssembly e OpenGL

 (micropolisweb.com)
3 pontos por GN⁺ 2024-06-17 | 1 comentários | Compartilhar no WhatsApp
  • Micropolis Web, baseado no SimCity Classic original da Maxis, foi disponibilizado em uma forma que roda no navegador, permitindo experimentar o clássico simulador de cidades sem instalação separada
  • O projeto é uma versão portada por Don Hopkins do jogo projetado por Will Wright e continua mudando, ainda em um estado experimental, não finalizado
  • O repositório no GitHub, vídeos de demonstração, além do livro e dos diagramas de Chaim Gingold, são fornecidos em conjunto para explorar mais a fundo a implementação e a história do SimCity
  • Os controles usam arrastar do mouse, roda do mouse, teclas de direção, teclas alfanuméricas e numéricas, permitindo mover, ampliar, carregar cidades, ajustar a velocidade, alterar a taxa de imposto e trocar o tileset
  • O nome “Micropolis” é usado de acordo com os termos da Micropolis Public Name License, e recursos adicionais e easter eggs ainda estão em preparação

Micropolis Web rodando no navegador

Como controlar e observações restantes

  • Controles do mouse

    • Arraste com o botão esquerdo para mover a tela
    • Use a roda do mouse para ampliar ou reduzir

  • Controles do teclado

    • Use as setas para mover a tela
    • Use as teclas de vírgula e ponto para ampliar e reduzir
    • Use teclas alfabéticas para carregar várias cidades
    • Use a tecla \ para gerar
    • Use as teclas numéricas para definir a velocidade
    • Use a tecla 0 para alternar a pausa
    • Use as teclas de colchetes para reduzir ou aumentar a taxa de imposto
    • Use - e = para trocar o tileset
    • Pressione o botão “X” na parte superior para ocultar a janela de instruções
    • Recursos adicionais e easter eggs estão em preparação
    • O aviso começa dizendo para não pressionar a barra de espaço, mas a explicação seguinte não está completa no texto fornecido

Leituras relacionadas

1 comentários

 
GN⁺ 2024-06-17
Opiniões no Hacker News

  • É divertido portar jogos antigos para a web. Hoje em dia, muitos jogos são menores que uma página web comum, então carregam rápido e rodam bem
    Acabei de portar Quake 3 e estou me divertindo mexendo nele: https://thelongestyard.link/

    • O motivo pelo qual não gosto do navegador para criar jogos é justamente a latência de entrada. Ainda assim, o trabalho é excelente
    • Fico curioso sobre por onde seria bom começar para fazer melhor esse tipo de coisa. Especialmente no caso de portar jogos antigos para Wasm

  • Demo 1 do Micropolis Web: https://www.youtube.com/watch?v=wlHGfNlE8Os
    Micropolis Web é a versão para navegador do Micropolis, o SimCity open source, e usa WebAssembly, WebGL e SvelteKit. É baseado no código original do SimCity Classic, projetado por Will Wright e portado por Don Hopkins; a primeira demo já roda o simulador em WebAssembly e a animação de tiles em WebGL, mas a maior parte da interface de usuário ainda está em desenvolvimento
    Site ao vivo: https://MicropolisWeb.com
    Código-fonte e documentação: https://github.com/SimHacker/MicropolisCore
    Livro de Chaim Gingold, "Building SimCity": https://mitpress.mit.edu/9780262547482/building-simcity/
    "SimCity Reverse Diagrams" de Chaim Gingold: https://smalltalkzoo.thechm.org/users/Dan/uploads/SimCityRev...
    Micropolis Web Space Inventory Cellular Automata Music 1: https://www.youtube.com/watch?v=BBVyCpmVQew
    A música foi criada por Juho Hietala, Blamstrain, e o Space Inventory Cellular Automata foi implementado por Don Hopkins: https://blamstrain.com/

    • É surpreendente que Building SimCity, de Chaim Gingold, tenha acabado de ser publicado em 4 de junho de 2024. Eu gostava muito dos diagramas dos algoritmos de SimCity antigamente e acho que também li a tese de doutorado que tratava em detalhes do funcionamento interno de SimCity
      Gingold, Chaim. “Play Design.” Ph.D. thesis, University of California Santa Cruz, 2016. https://www.proquest.com/docview/1806122688
      O porte de Micropolis para Wasm parece poder ser uma nova etapa de desenvolvimento. SimCity Classic no Macintosh influenciou muito, na minha infância, a forma como eu pensava sobre computadores e software, e fico feliz em ver isso ganhando nova vida

  • Não sou gamer, mas lembro de ter jogado SimCity quando era criança. Não sei se a jogabilidade mudou nos últimos 25 anos mais ou menos, ou se o navegador está quebrado, mas parece que nada funciona
    Dá para carregar uma cidade e vê-la se mexer, mas acho que no SimCity antigo dava para construir a própria cidade. Não deveria haver uma forma de o jogador realmente jogar?

  • Eu não esperava muito no mobile, mas no Firefox do Android esta página travou o navegador. Precisei matar o processo, e isso é raro.
    Como referência, tenho um joguinho que eu mesmo portei para o navegador. Fazer rodar foi muito fácil graças à combinação Emscripten+SDL2, mas, sinceramente, o maior esforço foi fazer com que ele fosse realmente jogável no celular: https://play.neverball.org/

    • Tenho a intenção de dar suporte a mobile, sim. Já corrigi um bug que impedia a execução no Firefox do Ubuntu, graças a um relatório de bug bem escrito com stack trace. Seria bom tentar de novo e, se não funcionar, reportar o bug incluindo stack trace e informações da plataforma.
      https://github.com/SimHacker/MicropolisCore/issues/1
      Em vez de esperar até ficar completo e perfeito, eu queria publicar o quanto antes para que outras pessoas pudessem testar. Por isso ainda há muito a fazer em interface de usuário, estabilidade, suporte multiplataforma, mobile etc.
      Assim que o simulador e o renderizador de tiles começaram a funcionar, adicionei um mínimo de zoom/pan, uma interface de controle por teclado e uma janela de dicas que pode ser fechada pelo botão "+" no canto superior direito.
      O que eu realmente espero é integrar com uma linguagem de programação visual como Snap! para permitir live coding, áreas de plugins, robôs, sistemas de monitoramento e controle, visualização e exportação de dados, e interfaces alternativas como dashboards do Grafana.
      Celulares Android podem ser conectados por cabo USB a um Mac ou PC, e iPhones a um Mac; então dá para verificar o console remoto, depurar e até fazer live coding pelo Chrome ou pelo depurador do Safari no Mac. Se as condições forem favoráveis, também pode funcionar por Wi‑Fi, mas talvez o Google tenha removido o recurso ou a Apple o tenha bloqueado desde o início.
    • Fiquei surpreso porque, no Firefox de um celular Android barato de 4 anos, a taxa de quadros é alta e quase não há engasgos. Não é como se houvesse um monte de texturas ou polígonos, mas não estou acostumado a ver esse nível de desempenho no navegador desse celular.
    • No Firefox do Android, do meu lado também não travou. Mas já vi algumas versões recentes do Firefox serem ruins no tratamento de PDFs, então talvez tenha a ver com diferença de versão.

  • Antigamente, portei um cliente de RuneScape para a web.
    https://play.rsps.app/
    Usa Wasm, TypeScript e WebGL.

  • Repositório do código-fonte: https://github.com/SimHacker/MicropolisCore

  • O que acontece ao apertar a barra de espaço é realmente surpreendente. O fractal é incrível.

    • Space Inventory foi inspirado na análise de World Quester 2 feita pelo Game Helpin' Squad, e quero tornar os menus e a interface de usuário do Micropolis tão sensacionais quanto os de World Quester 2.
      https://www.youtube.com/watch?v=0Gy9hJauXns

  • Fico me perguntando se modelos de linguagem de grande porte conseguiriam portar imediatamente um jogo desses

  • Por que há um corpo de bombeiros em quase todos os quarteirões da cidade?

  • Os controles não funcionam e, assim que o navegador carrega alguma coisa, a ventoinha da CPU começa a girar. Tem certeza de que isso não é só um minerador de criptomoedas malfeito? Se não for, não entendo por que publicar algo que não funciona

    • O objetivo é receber feedback sobre como ele se comporta em vários sistemas aos quais não tenho acesso. Acho que software, especialmente open source, fica melhor quando recebe feedback o mais cedo possível durante o desenvolvimento, em vez de ficar escondido até estar totalmente concluído e perfeito
      Não tenho dinheiro para comprar todos os tipos de computadores e celulares e, mesmo que tivesse, não teria tempo para testar tudo pessoalmente. Ninguém está me pagando para fazer isso, mas, se quiser, você pode apoiar pelo Patreon: https://www.patreon.com/DonHopkins
      Ainda assim, este projeto é algo que faço por paixão, não uma fonte de renda. No momento também estou oferecendo um produto especial em que fico calado por 5 minutos por mês sobre o tema que você quiser
      Todo o código-fonte está disponível no GitHub, e você pode reportar bugs ou fazer o build por conta própria. O navegador também inclui ferramentas de depuração e engenharia reversa para inspecionar o binário WebAssembly e o JavaScript compilado. Os shaders WebGL estão em texto puro, então também dá para verificar se correspondem ao código-fonte no repositório
      https://github.com/SimHacker/MicropolisCore
      Se encontrar evidências de software de mineração malfeito, pode denunciar ao FBI, à Interpol e ao GitHub. Como estou publicando o código-fonte e os binários com meu nome, minha conta do GitHub e meu domínio, também é fácil rastrear a origem
      Um exemplo de relatório de bug útil identificou o problema incluindo informações do sistema e stack trace, e graças a isso consegui corrigi-lo em poucos minutos: https://github.com/SimHacker/MicropolisCore/issues/1
      Também fico curioso se você tentou pressionar as teclas numéricas para controlar a velocidade. Considerando os números na parte superior do teclado, "1" desacelera para 1 frame por segundo com 1 tick do simulador por frame, e "9" roda a 120 frames por segundo com 50 ticks por frame. No Chrome do meu Mac M1, ele roda de forma suave e a interface também é bem responsiva
      Seria bom saber quais controles não funcionam, qual é seu hardware, sistema operacional, navegador e GPU, e se havia erros no console de desenvolvedor do navegador. Incluir o stack trace do console no relatório de bug ajuda bastante