Sep.07.16 Design Meets Surf Culture | Ericeira World Surfing Reserve
“The centre's chief objective is to present and explain the reserve and its main attributes: the 7 waves and their characteristics, the biosphere, the meteorological composition, the flora and fauna and the facilities. The detailed visualisation of data about the natural characteristics and surf conditions of the area is made possible by the close interweaving of design and technology. Via an innovative interactive video-mapping system combined with customized apps the visitors can explore this information in an accessible way. This is a milestone in terms of the transmission of complex geographical, meteorological and oceanographic data in surf reserves." Ericeira – World Surfing Reserve
AN INTERACTIVE INTERPRETATION CENTRE MEETING SURFERS’ NEEDS
With seven of the world's most venerated waves crashing upon its shores surfing is a huge deal in Portugal, impacting both local culture and tourism. While it is far more typical for hardcore surfing enthusiasts to keep their coveted waves under the radar, the local authorities have had a different approach, in the past posting official tourist signs to guide visitors to all the famous waves in the area.
The first of its kind in Europe, the Ericeira World Surfing Reserve Interpretation Center represents the epitome of that trend, and while it might be frustrating to some it is also remarkably well conceived and executed by a team of researchers, planners, programmers and designers.
We spoke to Rui Gato (Technical and Creative Director) and David Negrão (3D and Interactive Designer) of ALTA_International Creative Alliance about their outstanding contribution to the project using TouchDesigner for video-mapping of the scaled model, realtime generation of the data visualization, and the multitouch UI that controls and allows users to navigate the content of the Interpretation Centre. Exceptional work, enjoy!
Derivative:Can you tell us about the people involved in the project.
Experimentadesign is a knowledge production and project development unit working in design, architecture and design culture, and their team comprises a multidisciplinary mix of producers, designers, editors, researchers, strategic thinkers and creative people.
experimentadesign selected ALTA for the development of all the digital domains of the project, more specifically, the interactive table of the Interpretation Centre.
ALTA is a new company focused on interactive, immersive and mobile digital experiences, based in Lisbon, Portugal. We have a team of graphic designers, multimedia editors, TouchDesigner programmers, video editors, creative directors, and we love to develop new kinds of communication objects that involve cutting-edge technology.
Derivative:What were the tasks at hand? It seems like quite a level of complexity and parts...
ALTA: The main task at hand at Ericeira was the creation of a well-designed permanent immersive interface for the Interpretation Centre. The Interpretation Centre gives valuable insight into the best surfing spots. Several means of communication show for each wave the best conditions regarding the tide, wind and swell based on past meteorological information. Furthermore, the characteristics of the seabed, wave and break are also given, and visitors can explore the biosphere (climate, vegetation and species) and the facilities of the area.
Each of these facets of information and content needed to be integrated on a simple and effective interface that could accommodate several users at the same time, and be also playful and aesthetically interesting. To respond to this challenge, we decided to develop a complementary system, based on a mix of iPad apps (directed by ALTA's Digital Apps Creative Director, Margarida Moura Guedes) and an interactive TD based system (directed by ALTA's Mixedmedia Creative Director, Rui Gato)
Derivative:How did you use TouchDesigner?
ALTA: We used TouchDesigner as the core of the system that comprises the video-mapping of the scaled model terrain (1:1000), the realtime generation of the data visualization that gets displayed on the model, and the multitouch based User Interface that controls and allows the user to navigate through the content of the Interpretation Centre. Everything is programmed in TouchDesigner.
We started by converting a LIDAR scan of the 4.5km of coast that our production team managed to get from the Geological Institute of Portugal, and we did it inside TouchDesigner via an XYZ point cloud (CHOP to SOP). Then we exported the model to 123D Make and did the cutout layers to get the 3D model cut on a CNC machine.
Weather UI network (expand for full network view)
Weather UI network (expand for full network view)
Storm table projection network (expand for full network view)
Waves table projection network (expand for full network view)
We then used the same model to generate the animations for all the geological panes of the interactive table, and also to be the basis of all the realtime lights and sea level simulations, tidal movements, sun and moon cycles, etc.
The process divided into 4 main branches: 3D model videomapping, UI design, Sound Design, and Graphic Design. We developed at the same time as the experimentadesign team did the research and content management, and the rest of ALTA team did the iPad apps and the video footage edits. It took us 5 to 6 months of production to get to the opening day!
Annual cycle UI network
Annual cycle table projection network (expand for full network view)
Moon and tides UI network (expand for full network view)
On the UI side, we started with a 3D UI based on Render Pick, but soon we understood that basic 2D panels would allow for more dynamic changes at the end of the pipeline, so we opted for that instead. The main design problem to solve was the big amount of specimens of flora and fauna that the reserve comprises. Lots of buttons and pages of information for all the biosphere elements to show up.
On the projected map side, the first challenge was to correctly map the 3D surface, and do a nice edgeblend of 2 laser projectors, that we did using the edgeblend in the palette, and also using two Stoners, one for each output.
The Sound Design was spatialized using the outputs of the video projectors, via HDMI, to a 4 point system installed in the room.
Fauna instances table projection network prototype (expand for full network view)
Surfer's community table projection network (expand for full network view)
Derivative:That's a lot of scope! You must have learned a great deal in the process. Were there some surprises?
ALTA: We learned a LOT of TouchDesigner development with this project! The process was very intense, we got the chance to work on site for two weeks, an opportunity that contributed positively to the end result, because the local implementation team (Rui Gato and David Negrão on TouchDesigner programming, Manuel Morgado on Sound Design, and Tiago Moura on Graphic Design) got to "live" the room and made the final stage of implementation to be very intertwined with the site.
Derivative:Thank you very much guys and congratulations on the tremendous accomplishment... so do you surf much?! And what's next?
ALTA: ;) ... more very soon!
ALTA_International Creative Alliance
Strategic Design Director: Guta Moura Guedes Mixmedia Creative Director: Rui Gato Moura Guedes Digital Apps Creative Director: Margarida Gato Moura Guedes Financial Director: Rui Maria Morgado Mixmedia Graphic Design: Catarina Lee, Francisco Elias, Mariana Rosa Mixmedia Intern: Tiago Moura Motion Design: Rúben Santos 3D and Interactive Design: David Negrão Sound Design: Manuel Morgado Editor: Miguel Côrte-Real Production: Joana Morais