unseen city

Hi!
I am Linus, and this is a template for telling visual stories with 3d directly in the browser.

It was put together during my research within the M.A. Knowledge Visualization at ZHdK Zürich.

I am sharing this with you as an invitation to collaborate - on content, development or research.

The idea is to create a story about a future city scenario until May 2023.

Most of all, I want to exite you for this way of presenting 3d spaces in web articles, while being open to content and cooperation.

motivation

This collage of 3d plans, text, sketches and 3d scans was made with the idea of putting different modes of visualization side by side.

Wheter they are accurate blueprints, traffic simulations or paintings and artistic designs, they can all be equally relevant to an idea of the future city.

What exites my about both the city and this format is the idea of a space, where different views come together.

This is how the idea to apply this format in a context of city planning came about.

With accessibilty in mind, I am focusing on an interactive reading format:

An article augmented with scientific and artistic visualisations in 3d, approachable for online journalism, but allowing to be extended with interaction.

+

to make this format approachable, open tools are used and explored for possibilites. A documentation shows how to work with 3D in the browser, to enable individuals and small or large institutions alike to work with 3d in a context of interdisciplinary research communication.

I see this format as a great bridge between text-based and possible virtual knowledge cultures, accessible to all common (and mobile) browsers, based on the open building blocks of highly interactive web expieriences like browser-games or metaverses.

what the prototype can do

In its current stage, this seems to me like a great tool to communicate complex projects in city planning with diverse stakeholders.

I see an opportunity to bring early stage plans to life, provide an accessible format for visuals, text, 2d and 3d. The outlook of interactivity could further improve communication in city planning.

In practical terms, this demo can load common 3d models, also dynamically in layers. A complex cinematic camera can be animated in the scene - making a short film from a static model.

So far my research has documented simple processes to integrate 3d data from CAD, GIS, photogrammetry and 3d modelling tools. Since it is rendered live and built in three.js, it can be expanded with interactivity according to need.

+

three.js extends to interactivity known from metaverse-type web-apps or browser games. Examples are 3d drawing and annotations, free movement or tools for moving scene-objects.
Even open tools exist for the browser which allow for cooperation in production.
The camera movement here f.e. is designed in a browser tool that can be turned on for the readers to animate themselves.

To go further, I think it is best to focus an ongoing project or a need to tell a specific story. And have this content to inspire the direction in which animation and interaction will be developed.

I would love to hear your thoughts about this.

____cooperation
ideas____

A great collaboration I think would be with an institution who wants to explore 3D storytelling for regular use. Your content or ressources could use my pilot and thesis to set up for efficient production of 3d stories within your team, and give me a great opportunity to adapt the format to a production-context.

+

I would like to focus on this format as a freelancer after my studies, so I have a big interest in how it can function within the day-to-day of online communication. My written thesis is concerned with the design- and technological aspects. I would like to add the operational aspect into my research, f.e. work together on how this format can be integrated into larger cms systems or specific collaborative workflows.

Or - do you happen to be a developer, illustrator, 3d designer, writer or otherwise enthusiastic about the format?
As of now there are many possibilities to expand it! Sharing content or skills would surely make for an exiting interdisciplinary production of a 3d article as a shared reference for future projects.

Id love to hear your ideas. What would be great to have? What´s missing?
Below are some tasks I begun exploring which would be exiting to dive into deeper.

+

Webdevelopment:
-classic webdev, ui design, dynamic loading of 3d content.
-shader programming for 3d paint effects.
-optimizing performance with WebGL, webworkers, webassembly, data-streaming
-going further with interactions and game mechanics from three.js or moving to r3f

3d Modeling:
-mesh optimiziation of photogrammetry
-low poly / detail compromise
-general modelling with PBR material, UV unwrapping, baking shadows
-3d sketching with z-brush, greasepencil, penzil.app

Writing:
an utopian drift? carfree cities, unused, repurposed, temporary, abandoned spaces?
understanding the interdisciplinary process of city planning?
open!

Last but not least scientific advice and contributions would be a great benefit. Are you a researcher concerned with the city? I could visualize a complex traffic, city planning or social-geography related research or f.e. come by for an interview to feature a research within the article.

+

It seems in some cases 3D visualization is much more effective in showing relations and processes over other methods. An the combination with 2D Datavisualization is also possible. Also, to relate city engineering with city history f.e. would feed great into a discussion of utopian ideas of city planning.

Summary

Looking for Cooperation!
-browser scroll story for city models
-support for CAD, 3d models, photogrammetry, GIS Data.
-three.js and javascript for accessible and flexible production, extendability.
-Visualizing the future city?
-Get in touch with your content

Thanks and Credits.

I like to use and adapt public domain or creative commons material and used some in the scene you have seen:

Loïc Norgeot - WIP - Lowpoly People - 1 - CC-BY-4.0

Fuchsturm Jena (CC0)

GIS Data from Blender OSM Plugin (Baslerstr. Zürich)

Shahriar Shahrabi - Floating Castle - CC-BY-4.0 - changes made

The John Rylands Research Institute and Library - The John Rylands Library - Blueprint Model - CC-BY-4.0

craggle - Traffic Signal Box with Graffiti - CC-BY-4.0 - changes made

more background and an outlook

My interest in Cities intensified as a skateboarder, when i have spent a lot of time in random urban places.
It was always a great way to observe and interact outside of the day-to-day. I came to think of cities and what they mean to me as a place of interaction and exchange of ideas. Where one is exited and comfortable in being confronted with many different ways to live.

Thus I came to like ideas of making the city more playful, provide more public, green and also more undefined space. In this way im also interested in the idea of greatly limiting the use of cars within cities.

So the most versatile and interesting topic for me to try and visualize in 3d and test this format, I figured, would be a future city scenario. Politics, sustainability, arts, engineering or science might play a role, each having their own common way of visualizing or communicating ideas.

Wouldn´t it be an interesting expierience to see all those methods in one place?

With this in mind I here have made an experimental collage as a 3D Scene - to provide a starting point for discussion.

I imagine text, but also 3d simulations by engineers, plans by architects, sketches by citizens, 3d scans or historical photos, being side by side to explore in one environment.

During my B.A. in Philosophy/Sociology I worked as a Designer in Print, Video and Animation together with students and scientists. I started researching ways to expand online reading with interactive visualisations, because I felt like imagery can be just as meaningful as text. Using 3D then exited me especially, since 3D Scenes have become easier to use and even a standard browser feature.

I saw 3D Content being designed to understand complex ideas and information, f.e. by the New York Times, and decided to do a research on how to produce similar web-stories. The Design MA programme at ZHdK has a strong focus on 3D and the scientific image, which I wanted to combine within such an expierience, and so i applied for the programme. I thankfully got in and am now working on a pilot!

With this in mind I have made the exemplary scene you saw here.

Thank you for reading, I´d be happy to hear from you :)