2024 UXUI Portfolio

Page 1

PORTFOLIO JIAYU HUANG


EDUCATION

Master of Architecture Professional Degree | Philadelphia, US University of Pennsylvania Aug 2021- May 2024 Bachelors of Arts in Architectural Studies | Toronto, Canada University of Toronto Aug 2017- May 2021 Medieval of Art and Architecture (Summer Abroad) | Oxford, England University of Oxford Aug 2019- Sep 2019

EXPERIENCE

VR Designer | Philadelphia, US University of Pennsylvania Sep 2023- Dec 2022 Architecture Intern | Chicago, US Skidmore, Owings & Merrill Jun 2023- Aug 2022 Architecture Intern | New York, US Gensler New York Jun 2022- Jul 2022 Design Executive Officer | Lansdowne, Canada Cosmo Camping Inc Jun 2020- Jan 2022

AWARD & INVOLVEMENT

E.Lewis Dales Traveling Fellowship Winner University of Pennsylvania May 2023 Design Ideal Beam Competion - First Place University of Pennsylvania Mar 2022 Re: Action: A Field Guide to Agency by Design (Publication) University of Toronto Jun 2021

SKILL

Hand 3D Printing Laser Cutting Model Making Wood Work CNC Printing Photography Casting

Software Unity Figma Rhino Revit Adobe Illustrator Adobe Photoshop Adobe Premier Blender 3D


CONTENTS SPOLIA AGENCY TITLE PAGE

01

RESUME TOKYO VOID POSSIBILITIES IN URBAN VACANCY

02 04

THE BREATHING MAZE COMPUTATION INTERACTIVE MACHINE

12

CENOTAPH FOR NEWTON VR REMIXED REALITY

20

SKIN SCOPE SUSTAINABLE DATA CENTER

28

TANS-FORMAL RED HOOK BROOKLYN MIXED USE HOUSING

34

NOCTURNAL LUMINA FUTURE CITY VISUALIZATION

42


04


TOKYO VOID

POSSIBILITIES IN URBAN VACANCY Instructor: Jeannie Kim Completion: April 2021 Type: Academic- Undergraduate Thesis

The aging population continues to be a pressing issue in Japan, where the elderly population makes up a third of the Japanese population. Despite this, they are merely the focus of the design. Many elderly populations were either sent to the nursing home or instead living alone. They are often neglected by the city and even result in Kodokushi, which is a haunting phenomenon in Japan in which the elderly are dying at home and remain undiscovered for a long period due to physical immobility and social isolation with friends, family, and society. Taking a different approach from many precedents, which create an apparatus and separate the elderly population in “utopia”, an urban solution is proposed to reconnect this enormous but forgotten elderly population back to society. With the special concern of the oddness and temporariness of Tokyo urban fabric, a series of community infrastructure is designed to increase the bond of the community, linking the old and young in the neighborhood and providing some playful and short moments of escape for everyone in daily settings.

05


23 SPECIAL WARDS OF TOKYO Population by age group(%)

0-14 years 15-64 years 65+ years

Adachi

Arakawa

Edogawa

Itabashi

Katsushika

Kita

Koto

Taito

Meguro

Minato

Nakano

Nerima

Ota

Toshima

Setagaya

Shibuya

Shinagawa

Shinjuku

Suginami

Sumida

Bunkyo

Chiyoda

Chu-ku

//SITE SELECTION

Model: Miyu Kojima’s miniature replicas of the room of Japan’s “Lonely deaths“. 06

The seismic geographic feature has formed a distinct low and dense urban profile of Tokyo. Many of these buildings are relatively small in size, temporary in structure to respond to the unstable urban structure. These qualities make Tokyo result in many small and odd urban vacant spaces. The project finally grounded in the residential neighborhood of Kita city where it has voids in design and possibilities in absence, but most importantly it has the highest proportion of senior citizens among 23 wards of Tokyo, which are the main target of my design thesis.


//DESIGN PARTI Left- Over Space

Insufficient Park

Abandoned Space

Public Parking

Public

Private

Public

Semi-Public

Urban void spaces: Hidden in the unnoticed corner of the city and often operated outside of our normative urban planning system which is often neglected and unsuitable for development. In fact, it provides room for new definitions and informal approaches by the people. //PHOTO DOCUMENTATION

Abandoned Space

Insufficient Park

Left- Over Space

Public Parking

07


COMMUNITY INFRASTRUCTURE 1. Lighted Walking Cane 2. Separable Bench 3. Portable Mahjong Set 4. Moveable Screen 5. Signage Container 6. Mobilizer 7. Retractable Canopy

08


09


Community Support System コミュニティサポート

//COMMUNITY SUPPORT

This mobile container is the main structure of the series. It is an exhibition pavilion, a slide for children, and also a health station for the seniors. It serves as a pop-up center gathering spot that can be easily placed in parks that lack infrastructure and bring a new meaning to vacant lots.More than a physical architecture, the infrastructure is designed with a community support system to achieve a connected community. All the elders in th neighborhood are given a safety bracelet that tracks their health status. When they are in an emergency, the bracelet will send an alert to the central database and activate the center lightbox and LED screen. Once activated, it will flash and send community workers to help. 10


Temporary Program: Informal appropriation of an unused lot with the proposed design tool. 11


Void Space: A rendering shows how the column is activated, and void spaces are formed when the user approached it. 12


THE BREATHING MAZE

COMPUTATION INTERACTIVE MACHINE

Instructor: Maria Yablonia Team: Haiyen Chen, Jianghong Dai & Junjie Shen Completion: May 2020 Type: Academic

“Breathing Maze” is an interactive architectural machine that investigates the topic of “automated space” in architecture. The machine is able to respond to the individuals’ movements, serving as an automatic spatial divider for the users. Once the user approach one side of the device, the touch sensor will detect the movement of the user and activate the roller system and accordingly rise down to create a void for potential space, whereas the remaining ones serve as spatial dividers. The hexagonal pattern’s flexibility is an ideal geometry to achieve a chain reaction, and each individual module allows a dynamic change in pattern. The project thereby provides a possibility to satisfy the diverse needs for spatial configurations, a kind of spatial configuration that breaths with the users. In this group project, our group formulated the concept as a group. I am mainly responsible for mechanism designs and produce drawings to convey machine movement into diagrams and other 2D dimensional representations.

13


//DESIGN PARTI

//DESIGN PROGRESS

Scissor Lift Mechanism

14

Connect Arduino Component

Arduino Code Assigned Action

Laser Cut & Assemble

Aggregation


//SENSOR BOARD DETAIL

Once sensor is activated, motors on fabric roller and screw bar start to rotate.

Touch sensor activate scissor system and fabric roller.

Fabric roller keeps fabric in place when structure descends.

//STRUCTURE SECTION

Slider LED Light Panel

40cm

DC Motor

Fabric Roller

15


//ASSEMBLY DETAIL

1. Combine Two Scissor Structures 1. Combine Two Scissor Structures 1. Combine Two Scissor Structures

1. Combine Two Scissor Structures Add DC MotorS On Screw Bar 2.Add Motor ScrewBar Bar 2.Add DC DC Motor OnOn Screw

1. Combine Two Scissor Structures

+ 2.Add DC Motor On=Screw Bar + === + +

1. Combine Two Scissor Structures

ructures

+

2.Add DC Motor On Screw Bar

Moveable Pathyway Motor Screw Bar For Scissor Structure Moveable Pathway Motor Screw Bar 3. Slider Track Base Moveable Pathway + =For Scissor +Motor Screw Bar = Structure Moveable Pathway 3. Slider Track Base 2.AddMotor DC Motor OnBar Screw Bar Screw For Scissor Structure 3. Slider Track Base 2.Add DC Motor On Screw Bar For Scissor Structure Slider Track Base

+

3. Slider Track Base

ble Pathway = sor Structure

4. Double Scissor Structure

+

=

2.Add DC Motor On Screw Bar

+

+ Motor Screw Bar

+

4. Double Scissor + 3. Slider Track Base Structure

ay ure

athway Pathway ructure ar Structure

=

2.Add DC Motor On Screw Bar

=

Moveable Pathway = For Structure Scissor LiftScissor Moveable Pathway = =Mechanism

Moveable = Motor +Pathway Screw Bar For Scissor Structure

For Scissor Structure

Moveable Pathway

ScissorMoveable Lift Pathway Mechanism For Scissor Structure

Motor Screw Bar 3. Slider Track ForBase Scissor Structure

Double Scissor

+ +

=

Moveable Pathyway

= = = =

4. Double Scissor Moveable Pathway Scissor Lift 4. Double Scissor Moveable Pathway Moveable Pathway Double Scissor Moveable Pathway Structure For Scissor Structure For4.Scissor Structure Mechanism For Scissor StructureStructure Structure For Scissor Structure ForStructure Scissor Structure

+

++

+

+

+

=

ler Base

ase

Base

Roller Base

er Base

16

+

=

==

=

=

+ Combine DC Motor Combine Six Curtain 6. 5. Scissor Lift DC Motor SixMotor Motor Curtain Rollers Base 5. Combine DC Motor Six Motor Curtain To Curtain Roller Roller To Curtain Rollers Mechanism Roller To Curtain Roller Rollers 5. Combine DC Motor Six Motor Curtain 6. Scissor Lift Rollers Base To Curtain Roller Rollers Final Base Mechanism Roller Base 6. Scissor Lift Rollers Base 6. Scissor Lift Rollers Base Mechanism Mechanism

+

6. Scissor Lift+ Mechanism

+ + + Rollers Base =

6. Scissor LiftLift Scissor 6. Scissor Lift Rollers Base Rollers Base Rollers Base Mechanism 6. Scissor Lift Mechanism Mechanism Rollers Base Mechanism

=

4. Dou S

4. Dou S

Moveable Pathyway Scissor Lift ScissorStructure Lift For Scissor Mechanism Mechanism

+ Curtain + 5. Combine DC Motor Six Motor = Roller = Base To Curtain Roller Rollers ayPathway le 5. Combine DC Motor SixPathway Motor Curtain 4. Double Scissor RollerLift Base Moveable Pathway Double Scissor Moveable Moveable Pathway Scissor Lift Scissor 5. Combine 4. DC Motor Six Motor Curtain ure Base Lift 4. Double Scissor Moveable PathwayMechanismRoller Scissor or Structure Structure For Scissor For Structure To CurtainStructure Roller Rollers For Scissor Structure Scissor Structure Mechanism To Curtain Roller Rollers + Structure For Scissor Structure Mechanism =

4. Double Scis Structur 4

=

Roller Base Base Roller Final Base Roller Base

Roller Base Final Base Final Base

=

==

Final Base

Final Base

Final Base Final Base Final Base

6. Scissor Lift Mechanism

6

6. Scis 6. Scis Me

Me


17


Void Space: Each block of system is viewed as individual and adjustable module. When a group of modules aggregated together, it formed a wave like landscape. 18


19


20


CENOTAPH FOR NEWTON REMIXED REALITY

Instructor: Jeffrey Anderson Team: Yuhang Tao & Wei Wang Completion: December 2023 Type: Academic- Graduate

This project explores the evolutionary advancements made that now allow us to fully inhabit digital worlds through Virtual Reality. Leveraging the Game Engine unity and Metaquest 2 Patform, we design an immersive, photo-realistic models of the unrealized architectural leagcy, the “Cenotaph of Newton.” Users are invited to not merely observe but actively interact with this virtual space, offering a firsthand encounter with its grand scale and tangible materiality. Enhancing the immersive encounter, our project integrates with interaction design script with C#, audio, and visual effects. These elements synergize to add an additional layer to the experience, effectively communicating the sublime and solemn qualities inherent in the project. Beside this immersive experience, we seek out new and optimized processes of data management for utilizing Unity as a platform for visualization and pushed to develop new storytelling and interaction techniques way of presentation.

21


//STORYBOARD

4 5 3

1

2

FOREST PARK Scene 1

22

PLAZA Scene 2

CORRIDOR Scene 3

DOME Scene 4

ROOFTOP TERRACE Scene 5

Interact with a book triggers the lighting of the scene.

Standing on the ground floor provides a sublime view of the architecture.

The lights will progressively illuminate as the user walks through the corridor.

Enter the center of the spherical building, and the interactive light stands illuminate the scene.

Arrive at the rooftop garden area at night.

Audience standing far from the palace creates a tranquil atmosphere.

Experience the scale of people and the surrounding context.

An atmospheric scene unfolds, Interact with the books to actiwith an NPC scholar standing in vate the countdown and pick up the distance whispering the story. the fallen component.

Interact with the lamppost to brighten the rooftop pathway.

Panoramic view of the entire site, allowing one to experience its grandeur.

The light indicator will guide people as they navigate through the space

As the footsteps advance, the crowd disperses, and the entire space quietens once again.

The overhead spherical light begins to descend gradually as the audience clicks on the activator.

Interact with the central gate in the pool to enter the previous scene.

Interact with the falling apple to transition to the next scene.

Interact with the massive archway to transition to the next scene.

Interact with the staircase at the end of the corridor to reach the next scene.

The illuminated light leads the audience toward the gate, opening the way into the next scene.

Wandering through the garden standing at the expansive view of the landscape and fireworks.

Click the tree, and return to previous scene.

Click the boat, and return to previous scene.

Click the door, and return to previous scene.

Click the fountain, and return to previous scene.

Click the newspapre on the bench, and return to starting point.


//USER JOURNEY FLOWCHART

User Testing: A critic from UPenn involved testing and interacting with the space of a VR prototype using Oculus VR goggles.

23


//SCENE CHAPTER

24

FOREST PARK

PLAZA

FRONTCOURT

CORRIDOR

DOME

ROOFTOP TERRACE


Dome: In the central space, users can check the status of Newton. They may activate the chandelier mechanism, observing the descent and scene change.

Arrival Plaza: The user begins at the arrival plaza and experiences the sublime and monumental quality of the architecture in distance. 25


26


SKIN SCOPE

SUSTAINABLE DATA CENTER Completion: January 2022 Team: Bohan Lang, Shengnan Gao, Yiting Zhang Type: Evolo Skyscraper Competition

In this digital-driven era, data and informationare pervaded and intertwined in almost every aspect of our life. Our personal and work information, shopping habits, are all stored in the nebulous space that people are often not aware of or even know where it is. The data center of the modern-day is always hidden in the unnoticeable corner, and intentionally “undersigned”.SKIN SCOPE was designed to reimagine a new data center of the modernday, rather than a product of to be storage,the architecture becomes the part of the data machinery, vice versa. The public is invited to the visualizing the flow and deployment of the information. Additionally, the project was also aimed to tackle the potential issue within the data center, data security, energy insufficiency, and most importantly raise people’s awareness of the origin of daily consumption.

27


//DATA CENTER WORLD MAP

//REIMAGINATION The two types of data center architecture that currently exists fails to address a solution of the architectural dead space and invisibility from the rest of the world. The retrofit and warehouse design of the data-political atmosphere acts as plainly a storage facility that focuses on data and does not have concerns with the function of the space in conjunction with people and the practicality of sustainability, security and maintenance. In our proposal instead of treating the data as storage, we create a dynamic environment where data is no longer the sole focus, but instead,drawn out acting as a facade element enveloping and dictating the architecture of living space inside, wrapping around and forming a skeletal membrane that pulls the architecture together.

Presence

Presence

Data Center Warehouse

Data Center Warehouse

Future Data Storage in Facade

28

Future Data Storage in Facade


//DESIGN PARTI

Intial Massing

Horizontal Growth

Trimed Edge

Smooth Edge

Ring Formation

Interior Negative Void

Divide Level

Data Center Meander

Chamfered Angle

Data Center Access

Program Block

Final Form

29


//FACADE SYSTEM The data center is used as a facade element, defining the outer ring’s form and synthetic lighting condition, while acting as a security measure. Second, to mitigate the damage done by the heat generate from the data storage, the environment is cooled by the ocean as it is embedded into the ocean’s continental shelf. Additionally, tidal energy is generated at the foot of the skyscraper to further take advantage of business district in Hong Kong, addressing sustainability concerns. The facade’s changing light and spatial condition are dictated by two systems that are critical in ventilation and circulation using the hot aisle and cold aisle arrangement.However, instead of the typical need for a 7-tile pitch square footage, the design of data storage racks as drawers saves room and further influences the light condition from the exterior facade. As a drawer is pulled out, the light on the exterior skin facade slightly,

Transport Pipe Converter Sluice Gates Turbine

When the water level is high on one side of the barrage than the other, water is allowed to flow through the turbines to generate electricity.

Level of High Tide

Level of Low Tide

Tidal turbines are used as a power generator to support the skyscrapers’ use of energy and waste consumption. These turbines are very effective as with the same size blades as wind turbines,they can capture exponentially larger amounts of energy. 30


//Sky Lounge

// Data Storage

// Office

// Data Center

// Information Center

// Water Observatory

// Mechanical Storage

// Tidal Energy Turbine

31


32


33


34


TRANS-FORMAL RED HOOK BROOKLYN MIXED USE HOUSING Instructor: Ben Krone Completion: January 2022 Type: Academic - Graduate

Red hook is a neighborhood that is vibrant on one side and shares the skyline of New York but, on the other side, is away from the bustling core and allows the growth of the vernacular culture. With the aim to reinforce the cultural identity and historical legacy, the design strengthens the unique waterfront view through the spatial technique of layering and tilting in order to facilitate the proximity experience of seeing and living between residents and the neighborhood. Moreover, the project has reactivated the artistic community and the hidden local talents, such as the glass-making brewery, by transforming the liberty warehouse into a cultural hub that reveals the making process. The liberty warehouse becomes a mix of commercial, manufacturer, and residential use, where people can do activities of wine tasting and touring the factory. A sense of hierarchy and boundary is blurred with a more integrated and open relationship making the public more common to the audience.

35


//DESIGN PARTI

Site

Unit Aggregation

Renovation Area

Circulation& View

Facade Alteration

Detail& Roofscape

Plan: An assemble plan shows a combination of a public bar( ground floor), a semi-public winery(second floor), and private housing(third floor) from left to right. 36


Exterior Roof Garden: Exterior Roof is an open rooftop garden redefines the existing abandon roofscape.

Public Common Lounge: An integrated bar that sees through beer making process. 37


//ELEVATION

South Facade Elevation: South Facade shows a reappropriation of existing brickwork. The open glass front captures the winery culture of the red hook by revealing the whole making process and from manufacture to final delivery to the bar below. See the whole process all at once; This is the best name card that represents identity of the neighborhood.

38


39


40


41


42


NOCTURNAL LUMINA FUTURE CITY VISUALIZATION

Completion: January 2022 Type: Schenk-woodman Competition

A series of photomontages and architectural renders serves as a powerful and visionary tool, designed to eloquently convey the future aesthetic and vibrancy of street life in two cities that have profoundly influenced both my identity and my aspirations as a designer: Toronto and Philadelphia. These two urban landscapes, which have left an indelible mark on my creative journey, serve as the canvas for a speculative exploration of the evolving urban fabric. In my mind’s eye, I envision a future where relentless urbanization and rapid technological advancements converge to revolutionize the very essence of the city street. It becomes a dynamic, bustling nexus, harmoniously blending the commercial and entertainment realms.

43


Toronto in 2046: King Street in Toronto embodies a rich cultural heritage, historically known for its vibrant mix of art, entertainment, and bustling nightlife. Speculating on its future, King Street could transform into an even more dynamic and innovative district. Embracing cutting-edge technology, it might become an immersive hub where commerce and entertainment seamlessly merge, featuring augmented reality displays, interactive storefronts, and dynamic lighting.

44


45


Callowhill Night Market: is designed to revivify the vitality and regional identity of the site. The vibrant lighting ensures its safety at night and makes the area an exciting place for night out. In addtion, the neon light wrap around the region as a ribbon, highlighting the area as a recreational center, and most importantly bring the pedestrian flow to the nearby business. 46


47


THANK YOU


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.