https://github.com/kimstacy/mars

UCLA Creative Labs + ACM Hack 🌏  Natalie Mazmanian & Stacy Kim
https://github.com/kimstacy/mars

acm bloom hackathon in-progress space threejs ucla

Last synced: 12 days ago
JSON representation

UCLA Creative Labs + ACM Hack 🌏  Natalie Mazmanian & Stacy Kim

• Host: GitHub
• URL: https://github.com/kimstacy/mars
• Owner: kimstacy
• Created: 2020-12-15T01:24:48.000Z (about 4 years ago)
• Default Branch: main
• Last Pushed: 2020-12-27T21:07:31.000Z (about 4 years ago)
• Last Synced: 2024-11-21T11:26:40.336Z (2 months ago)
• Topics: acm, bloom, hackathon, in-progress, space, threejs, ucla
• Language: HTML
• Homepage:
• Size: 26.6 MB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# The 2033 Mars Landing

## Inspiration

Telling an untold story was a creative challenge that we wanted to take on headfirst.

The excitement of the second space race has inspired us to look to the future with optimism. Through an interactive timeline written from the perspective of a hypothetical future historian looking back on the first Mars landing, we hope to remind global citizens that we are a part of a future in the making. 

## What it does

Our project tells the story of the Mars Landing from the perspective of 2099. So far, you can learn about what led up to the Mars landing and the rovers that were sent for the job. You will soon be able to interact with 3D models of various elements on our site.

## How we built it

Our web platform was built with JavaScript, Node.js, HTML5, and CSS3. We used Figma to prototype and design. Our design resources were comprised of vectors from [unDraw](https://undraw.co/) and 3D models sourced from NASA’s [3D Models](https://nasa3d.arc.nasa.gov/models) and [Mars Exploration Program](https://mars.nasa.gov/multimedia/more-resources/?page=0&per_page=50&order=pub_date+desc&search=&category=239%2C244%2C243%2C242%2C241%2C316%2C324). We used Google’s [model-viewer](https://modelviewer.dev/)  web component to render the models in the browser. 

## Challenges we ran into

Due to outside obligations and time constraints, we were unable to devote as much time as we had hoped to! With the existing challenges now gone, we’re excited to continue building forth and working together to update our current MVP. Another interesting challenge was figuring out how to optimize 3D models for better web performance. Without software such as C4D, Blender, or Maya, converting .obj files to glTF/GLB was a potential rabbit hole. We were able to overcome this by finding .glb assets through NASA’s resources page.

## Accomplishments that we're proud of

We’re proud of our accomplishments prototyping and demonstrating collaborative teamwork for an exciting cause. Given the short time frame of approximately two days, we’re very proud of our ability to handle new frameworks and workflows in a quick and effective manner.

## What we learned

We learned a lot about the current state of Mars exploration, as well as a lot more about Figma and CSS.

## What's next for The 2033 Mars Landing

We look forward to launching a live website detailing the full story of the 2033 Mars Landing, from rovers to rockets and everything in between. We might even edit our story to be historically accurate as the years pass by.

## Built With

HTML, CSS, JavaScript, Node.js, Figma, 3D, Google Model Viewer

## Try It Out

[Figma](https://www.figma.com/proto/XfWA5m6B4IrNbXLH5ummRp/Mars-Landing?node-id=0%3A3&viewport=368%2C304%2C0.0788225457072258&scaling=min-zoom)