WARREN WIDJAJA
D E S I G N
P O R T F O L I O
U N I V E R S I T Y OF I L LI N O I S
04
Architecture
24
UI Design
40
Graphics
Preface
University of Illinois, 2015
This portfolio showcases a number of design works I did during my four years at the University of Illinois. The projects that are shown here are included within the areas of Architecture, UI design, and graphic design.
06
Natural Theatre
10
The Code House
14
Navigating Glows
18
Ascending Dance
Architecture
The projects shown in this section mostly focus on the interactions between space and user experience factor with its inhabitants. Each specific experience is conducted by the use of elevation difference, materiality, and cirulation.
NATURAL THEATRE The main concept of this design is allowing the inhabitants to fully experience the site along with the building. The main goal was to create an experience where inhabitants of the building will still be able to feel the essence of the outside world of nature however still under the protection of the construction made by man
Using the natural slope of the site at Kickapoo State Park, the building design is separated between the public and private spaces, having the former on the top and the latter on the bottom.
First Floor Plan
Basement Floor Plan
Exploded Axon The main entrance path is designed in a way that allows people to still be one with nature right upon entrance. The curtain wall extends to the other side of the building, connecting the visual transparency of the two sides
main circulation route
performing area
private performers space
The performance area is accessed through the main circulation route which opens to an audience seating facing a curtain wall behind the stage. This allows natural lighting to access the space and illuminate the performance. The curtain wall connects the audience members directly to the beautiful slope filled with greenery. In addition, a view of the lake can also be accessed
Performers are provided a separate private space from the audience where preparations for the performance can be done. Facilities such as bathrooms, dressing rooms, and storage rooms are provided within the space. The curtain wall that spreads along the walls provide the performers with the same nature view provided for the audience during performances.
SECTION A
SECTION B
THE CODE HOUSE {}
The Code house was specifically designed for a tech startup founder whom works from home with a close team. The house focuses on its circulation and facade to Illustrate the process of coding
Floor Plans
Elevations
Section A
Section B
The logic behind the design is implented on the 4 facades of the building. The four facades represent different yet similar logical patterns that represent the basis of coding, where each part of the code looks different from one another to create one single product.
However, although the four facades all represent different types of pattern and style, all of them are connected together through its linear window patterns horiontally and vertically. The purpose of this was to highlight again about the concept of coding. Although parts of the code might look different to one another, they are all binded and connected to each other forming a single unit.
master bedroom
open ceiling
kitchen dining area work area
Navigating GLOWS This project was an attempt to explore the use of lighting to create a delightful experience for the visitors of Java City. With this in mind, the design decided to take on a course of using lighting as a visual trail that leads to a greater experience at its destination such as a cafe. As the visual trail, low intensity LED floor light fixtures will be scattered on the floor, acting as a trail guiding visitors to their destination. In addition, once a person steps on the fixture, it intensifies and dims accordingly leaving illuminated “footsteps” behind. This highlights an eye-catching and pleasing experience that encourages movement to another point.
Upon arrival to their destination, a number of floor lights will sparkle and welcome them. The lights will reflect user activity by accustoming to the intensity of physical interaction accordingly. In custom to different kind of events such as holidays, the fixtures will again adjust to the people’s steps and activity, transforming in mood and atmosphere every time.
ASCENDING DANCE Located in Kickapoo state park, the concept of this design was to defy the sloping hill and create a private dance studio that gives the dancers a feel of flight. Upon entrance, a ramp will be available giving access to another dance studio that faces up beyond the hills viewing the lake from above.
As the design was in a focus for disabled dancers, there were no stairs installed within the building and exchanged with a long ramp. The ramp allows the same experience for both disabled and regular people. This creates an ascending atmosphere that can be experienced together by both at the same time
Going over the slope, the building ascends upon the ground going the dancers a flying feeling by using the second studio. The exterior walls are designed to flow and reach one single point, concentrating on a destination towards the lake
1
2
Section 1
Section 2
INTERIOR RENDERINGS
CONCEPT RENDERINGS
26
Chiqoo
32
Courselis
UI Design
This section showcases design works in the field of User Interface and web design. The projects are collaborations with students from the computer science department at the University of Illinois. Projects were in the area of social networking applications for both mobile and desktop.
S H A R E
D E L I C I O U S N E S S
a user i nterf ace desi gn pr oje ct
CONTEXT Chiqoo is a mobile application designed for android that allows users to share their personal gourmet experiences The project was done in collaboration with students form the computer science department at the University of Illinois. Showcased designs represent the workflow and layouts of the interface
LAYOUT DESIGN
WIREFRAME
The app runs on a simple navigation by usng tabs illustrated with intuitie icons.
ICONOGRAPHY Sample of custom icons, simple iconography illustrating features
FEED The feed feature is where the main activity of the app happens where users can be updated with the pictures that are uploaded by other users they follow Users are able to comment and favor their favorite pictures and engage with other users
EXPLORE Users will be able to search for other users and specific food pictures. There are two separate options that allow an easy search expreince looking through pictures and people
PROFILE The profile feature allows users to explore another user’s photo uploads and engagement. It also allows them to see pictures that hae been included in teir own personal favorites album.
CAMERA
ACTIVITY
The camera tab allows useres a quick access to taking pictures at any moment
Users will be able to keep track whether any new pictures or engagment are happening within their circle of followers
COURSELIS the right courses, the right job
Courselis is a web application that allows Alumni connect with current students of their respective institutes and share advice about courses that will be essential for their dream job
Students will be able to view reviews of certain courses, ask questions, and simply strengthen their network with experts in their desired career area
LAYOUT DESIGN
THE START Both Alumni and Students can sign up according to their current positions. Information can later be instantly accessed after registration
NAVIGATION COURSELIS
About
Companies
Reviews
Specific courses can be accessed by typing in the name of the course in the search bar. Results based on the specific university can be chosen and viewed Information about a specific course will be divided in three simple tabs, allowing users to explore their desired information
ABOUT General Information about the course including its description, rating, and terms A separate recommendations section is displayed to show courses that are relevant to the one currently viewed
REVIEWS Users will be able to give points to credible reviews. The points will contribute to the reviewer’s karma points, an indicator of credibility in Courselis Reviews are sorted by the number of points, also featuring comments to trigger engagement
COMPANIES The companies tab shows a list of corporations that are interested in people with expertise in the specific course
PROFILE Students are able to access alumni profiles and see their latest activities. The profile page shows how active an alumnus is and the amount of karma shows his or her credibility in giving reviews
PROFILE Shows the Alumnus’ general information such as name, followers, and karma status
Displays the Alumnus’ recent activity and reiews. Rating of the reviews can also be quickly accessed
A graph is shown representing the activity chart of the Alumnus. It displays the overall number of karma points the user receives each day
The Hall of Fame is a feature that shows the number of karma points an alumnus received on the courses he reviewed. His highest course will receive a gold symbol followed with silver and bronze
Graphics
The works showcased in this section is made up of multiple graphic works including branding, character illustrations, and sketches
Sketches
Branding
Character Icons
Warren Widjaja wwidjaj2@illinois.edu