Logo

    Building a Level Viewer for The Legend Of Zelda - Twilight Princess

    enAugust 04, 2024
    What motivated Tommy to create a level viewer for Twilight Princess?
    Which file formats are used by Nintendo for model data?
    Who were the pioneers acknowledged by Tommy in his project?
    What challenges did Tommy face during his project?
    How has the discovery of JSYSTM impacted the gaming community?

    Podcast Summary

    • Game technology, Passion for learningPassion and determination can lead to advanced learning experiences and discoveries in complex technology projects, as demonstrated by an individual's journey to build a level viewer for The Legend of Zelda using web technologies and game model formats.

      Passion and determination can lead to advanced learning experiences and discoveries, even in complex technology projects. Tommy, an individual with a passion for The Legend of Zelda and game production, embarked on a challenging yet rewarding journey to build a level viewer for Twilight Princess using web technologies like 3.js and WebGL. This project required months of research, with credit given to pioneers like Lord Ned, Thockeys, Jasper Street Pierre, Kiwi, Dolphin Emulator team, Gamma, Zan, Greater Than Water, Fog, and Animated Textures. BMD and BDL are the file formats used by Nintendo for storing model data in its GameCube and Wii games, part of Nintendo's J3D graph library. BMD first appeared in Luigi's Mansion, while BDL was introduced in The Wind Waker to improve rendering efficiency. Super Mario Galaxy 2 was the last game to use this model format. Tommy's project allowed him to explore his passion for analyzing game levels and immersing himself in the details of how they were made. Despite the challenges, he is excited to continue this learning journey and discover new things along the way. It's important to note that while Tommy shared some details about his project, he couldn't share the interactive viewer, models, or rooms due to fair use limitations. Nonetheless, his passion and dedication to learning and exploring technology serve as an inspiration for anyone looking to dive deeper into a topic they love.

    • Nintendo JSYSTM toolkitDiscovery and exploration of Nintendo's JSYSTM toolkit by the gaming community led to the creation of a vibrant modding scene, enabling custom models, textures, and even new games.

      The J-S-Y-S-T-E-M toolkit, developed by Nintendo, is a crucial component in creating games for their consoles. This proprietary software includes various libraries and tools for tasks such as 3D modeling, animation, and physics. One of these libraries, J3D Graph, is responsible for handling 3D graphics and uses Binary Model (BMD) and Binary Display List (BDL) file formats. Reverse engineers and game modders discovered JSYSTM in the early 2000s by analyzing the code structures and libraries shared among Nintendo GameCube and Wii games. They extracted the JSYSTM libraries and began documenting and reverse-engineering its components, leading to the creation of a vibrant modding community. One individual, not initially interested in the specific file formats, discovered a simple object within the game files and began creating tools to work with them. This led to further exploration and understanding of the JSYSTM format and its capabilities. The discovery and exploration of JSYSTM have had a significant impact on the gaming community, enabling modders to create their own custom models, textures, and even new games using the extracted libraries. This vibrant modding community continues to exist today, with many sharing their findings and tools online. In summary, the J-S-Y-S-T-E-M toolkit is a vital part of Nintendo game development, and its discovery and exploration by the gaming community have led to numerous innovations and the creation of a thriving modding scene.

    • BMD file format hierarchyUnderstanding the hierarchy of nodes in the INF section of the BMD file can help determine material assignments for shapes in the model, but the relationship between shapes and materials isn't always straightforward and requires careful analysis.

      Understanding the structure of a complex file format like BMD requires a combination of technical knowledge and problem-solving skills. The author's experience with extracting a door object from the file demonstrates the importance of having accurate documentation and the ability to adapt when the information isn't perfect. He also learned that the hierarchy of nodes in the INF section of the BMD file can help determine the material assignments for shapes in the model. However, the relationship between shapes and materials isn't always straightforward and requires careful analysis. The author's successful extraction of the door object gave him the confidence to attempt extracting an entire area, but he encountered issues with incorrect vertex orders and missing textures. The solution involved looking at the scene hierarchy in the INF section to understand the material assignments for the shapes. Overall, the process of reverse engineering a 3D model from a complex file format involves a lot of trial and error, but with the right tools and knowledge, it's possible to extract valuable information and create accurate 3D models.

    • TV stages in GameCubeTV stages in GameCube played a crucial role in handling textures, colors, and transparency effects despite the console's limitations, enabling the creation of atmospheric games like Twilight Princess.

      The GameCube's use of TV stages played a significant role in how textures, colors, and transparency effects were handled in games like Twilight Princess. TV stages were responsible for blending textures, managing colors, and applying transparency effects, even if the GameCube didn't support transparency effects in the same way as modern games. The speaker's journey to recreate the game's atmosphere involved researching and implementing fog, bloom, and cloud shadows using blending TV stages. Although progress has been made, there is still much to explore and add to the viewer, including fog, BTK, texture animation, and other atmospheric effects to make it as accurate and immersive as possible. This project served as a reminder of the ingenuity and complexity behind the technical limitations of the past and the appreciation for the beauty of Twilight Princess.

    Recent Episodes from Programming Tech Brief By HackerNoon

    Java vs. Scala: Comparative Analysis for Backend Development in Fintech

    Java vs. Scala: Comparative Analysis for Backend Development in Fintech

    This story was originally published on HackerNoon at: https://hackernoon.com/java-vs-scala-comparative-analysis-for-backend-development-in-fintech.
    Choosing the right backend technology for fintech development involves a detailed look at Java and Scala.
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #java, #javascript, #java-vs-scala, #scala, #backend-development-fintech, #should-i-choose-scala, #java-for-fintech-development, #scala-for-fintech-development, and more.

    This story was written by: @grigory. Learn more about this writer by checking @grigory's about page, and for more stories, please visit hackernoon.com.

    Choosing the right backend technology for fintech development involves a detailed look at Java and Scala.

    A Simplified Guide for the"Dockerazition" of Ruby and Rails With React Front-End App

    A Simplified Guide for the"Dockerazition" of Ruby and Rails With React Front-End App

    This story was originally published on HackerNoon at: https://hackernoon.com/a-simplified-guide-for-thedockerazition-of-ruby-and-rails-with-react-front-end-app.
    This is a brief description of how to set up docker for a rails application with a react front-end
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #software-development, #full-stack-development, #devops, #deployment, #dockerization, #rails-with-react, #hackernoon-top-story, #react-tutorial, and more.

    This story was written by: @forison. Learn more about this writer by checking @forison's about page, and for more stories, please visit hackernoon.com.

    Dockerization involves two key concepts: images and containers. Images serve as blueprints for containers, containing all the necessary information to create a container. A container is a runtime instance of an image, comprising the image itself, an execution environment, and runtime instructions. In this article, we will provide a hands-on guide to dockerizing your Rails and React applications in detail.

    Step-by-Step Guide to Publishing Your First Python Package on PyPI Using Poetry: Lessons Learned

    Step-by-Step Guide to Publishing Your First Python Package on PyPI Using Poetry: Lessons Learned

    This story was originally published on HackerNoon at: https://hackernoon.com/step-by-step-guide-to-publishing-your-first-python-package-on-pypi-using-poetry-lessons-learned.
    Learn to create, prepare, and publish a Python package to PyPI using Poetry. Follow our step-by-step guide to streamline your package development process.
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #python, #python-tutorials, #python-tips, #python-development, #python-programming, #python-packages, #package-management, #pypi, and more.

    This story was written by: @viachkon. Learn more about this writer by checking @viachkon's about page, and for more stories, please visit hackernoon.com.

    Poetry automates many tasks for you, including publishing packages. To publish a package, you need to follow several steps: create an account, prepare a project, and publish it to PyPI.

    Building a Level Viewer for The Legend Of Zelda - Twilight Princess

    Building a Level Viewer for The Legend Of Zelda - Twilight Princess

    This story was originally published on HackerNoon at: https://hackernoon.com/building-a-level-viewer-for-the-legend-of-zelda-twilight-princess.
    I programmed a web BMD viewer for Twilight Princess because I am fascinated by analyzing levels and immersing myself in the details of how they were made.
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #reverse-engineering, #bmd, #game-development, #the-legend-of-zelda, #level-design, #web-bmd-viewer, #level-viewer-for-zelda-game, #hackernoon-top-story, and more.

    This story was written by: @hackerclz1yf3a00000356r1e6xb368. Learn more about this writer by checking @hackerclz1yf3a00000356r1e6xb368's about page, and for more stories, please visit hackernoon.com.

    I started programming a web BMD viewer for Twilight Princess (Nintendo GameCube) because I love this game and as a game producer, I am fascinated by analyzing levels and immersing myself in the details of how they were made.

    How to Simplify State Management With React.js Context API - A Tutorial

    How to Simplify State Management With React.js Context API - A Tutorial

    This story was originally published on HackerNoon at: https://hackernoon.com/how-to-simplify-state-management-with-reactjs-context-api-a-tutorial.
    Master state management in React using Context API. This guide provides practical examples and tips for avoiding prop drilling and enhancing app performance.
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #reactjs, #context-api, #react-tutorial, #javascript-tutorial, #frontend, #state-management, #hackernoon-top-story, #prop-drilling, and more.

    This story was written by: @codebucks. Learn more about this writer by checking @codebucks's about page, and for more stories, please visit hackernoon.com.

    This blog offers a comprehensive guide on managing state in React using the Context API. It explains how to avoid prop drilling, enhance performance, and implement the Context API effectively. With practical examples and optimization tips, it's perfect for developers looking to streamline state management in their React applications.

    Augmented Linked Lists: An Essential Guide

    Augmented Linked Lists: An Essential Guide

    This story was originally published on HackerNoon at: https://hackernoon.com/augmented-linked-lists-an-essential-guide.
    While a linked list is primarily a write-only and sequence-scanning data structure, it can be optimized in different ways.
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #data-structures, #linked-lists, #memory-management, #linked-lists-explained, #how-does-a-linked-list-work, #hackernoon-top-story, #eviction-keys, #linked-list-guide, and more.

    This story was written by: @amoshi. Learn more about this writer by checking @amoshi's about page, and for more stories, please visit hackernoon.com.

    While a linked list is primarily a write-only and sequence-scanning data structure, it can be optimized in different ways. Augmentation is an approach that remains effective in some cases and provides extra capabilities in others.

    How to Write Tests for Free

    How to Write Tests for Free

    This story was originally published on HackerNoon at: https://hackernoon.com/how-to-write-tests-for-free.
    This article describes deeper analysis on whether to write tests or not, brings pros and cons, and shows a technique that could save you a lot of time
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #testing, #should-i-write-tests, #how-to-write-tests, #increase-coverage, #test-driven-development, #why-tests-matter, #what-is-tdd, #are-tests-necessary, and more.

    This story was written by: @sergiykukunin. Learn more about this writer by checking @sergiykukunin's about page, and for more stories, please visit hackernoon.com.

    This article describes deeper analysis on whether to write tests or not, brings pros and cons, and shows a technique that could save you a lot of time and efforts on writing tests.

    Five Questions to Ask Yourself Before Creating a Web Project

    Five Questions to Ask Yourself Before Creating a Web Project

    This story was originally published on HackerNoon at: https://hackernoon.com/five-questions-to-ask-yourself-before-creating-a-web-project.
    Web projects can fail for many reasons. In this article I will share my experience that will help you solve some of them.
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #web-development, #security, #programming, #secrets-stored-in-code, #library-licenses, #access-restriction, #closing-unused-ports, #hackernoon-top-story, and more.

    This story was written by: @shcherbanich. Learn more about this writer by checking @shcherbanich's about page, and for more stories, please visit hackernoon.com.

    Web projects can fail for many reasons. In this article I will share my experience that will help you solve some of them.

    Declarative Shadow DOM: The Magic Pill for Server-Side Rendering and Web Components

    Declarative Shadow DOM: The Magic Pill for Server-Side Rendering and Web Components

    This story was originally published on HackerNoon at: https://hackernoon.com/declarative-shadow-dom-the-magic-pill-for-server-side-rendering-and-web-components.
    Discover how to use Shadow DOM for server-side rendering to improve web performance and SEO.
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #server-side-rendering, #shadow-dom, #web-components, #declarative-shadow-dom, #static-html, #web-component-styling, #web-performance-optimization, #imperative-api-shadow-dom, and more.

    This story was written by: @pradeepin2. Learn more about this writer by checking @pradeepin2's about page, and for more stories, please visit hackernoon.com.

    Shadow DOM is a web standard enabling encapsulation of DOM subtrees in web components. It allows developers to create isolated scopes for CSS and JavaScript within a document, preventing conflicts with other parts of the page. Shadow DOM's key feature is its "shadow root," serving as a boundary between the component's internal structure and the rest of the document.

    How to Scrape Data Off Wikipedia: Three Ways (No Code and Code)

    How to Scrape Data Off Wikipedia: Three Ways (No Code and Code)

    This story was originally published on HackerNoon at: https://hackernoon.com/how-to-scrape-data-off-wikipedia-three-ways-no-code-and-code.
    Get your hands on excellent manually annotated datasets with Google Sheets or Python
    Check more stories related to programming at: https://hackernoon.com/c/programming. You can also check exclusive content about #python, #google-sheets, #data-analysis, #pandas, #data-scraping, #web-scraping, #wikipedia-data, #scraping-wikipedia-data, and more.

    This story was written by: @horosin. Learn more about this writer by checking @horosin's about page, and for more stories, please visit hackernoon.com.

    For a side project, I turned to Wikipedia tables as a data source. Despite their inconsistencies, they proved quite useful. I explored three methods for extracting this data: - Google Sheets: Easily scrape tables using the =importHTML function. - Pandas and Python: Use pd.read_html to load tables into dataframes. - Beautiful Soup and Python: Handle more complex scraping, such as extracting data from both tables and their preceding headings. These methods simplify data extraction, though some cleanup is needed due to inconsistencies in the tables. Overall, leveraging Wikipedia as a free and accessible resource made data collection surprisingly easy. With a little effort to clean and organize the data, it's possible to gain valuable insights for any project.