Module 2 Formstorming

Sanren Zhou


Project 2


Assignment 1

My first Mapbox quest. My original image was a night view of Montreal. I used the yellow color of the lights to show the green space and create a feeling as if I were looking down on Montreal from high in the sky at night. Along with the tutorial, I figured out how to change the colors in the map. I created a map style with blue, purple and green as the main colors. It is futuristic, but also very much like how people understood and looked to the future during the millennium. I went on to explore more of Mapbox's features. In this image, I removed the road signs, leaving only the main area labels for a cleaner image. In this image, I removed all text to make the map more purely a visual symbol and to help with laser cutting. I removed all the text, and unnecessary details like: sidewalks. This makes the map more suitable for laser cutting. Also, while exploring Mapbox I realized that by clicking I can bring up a menu of selected areas and target the selected area, instead of having to go from the layer menu one by one to find the place I want to change. In this style, I used the standard colors of Sheridan College. Sure enough it came up with a map style that has a Sheridan vibe to it. I designed this style using green as the main color. I think it is perfect for an environmental theme and is also great to use as a promotion for the city. For this attempt, I dragged a monochrome image into Cartogram to see what kind of style I would get. The result is that Mapbox will saturate the monochrome to give a minimalist map style. I thought the colors of the previous design were too dark, and I wanted a more childlike style. So I dragged a screenshot of Hayao Miyazaki's (a Japanese animator) work into Cartogram, and I got an anime-like texture for the map. I like it very much because looking at it makes me feel like I'm stepping into a manga world. I found a bench converted from a snowboard on the Sheridan campus and photographed it as a reference image for this style. In this style, the land color comes from the skis, the road color comes from the shadows in the photo, and the river color comes from the wall in the photo. The reference image for this style is the Learning Commons at Sheridan College. The main color in the Learning Commons is the off-white color of the metal ceilings, which is used in this style to give it a clean, industrial look as well. The stained glass of Sheridan's cafeteria is impressive, and the style of the map derived from it as a reference color is very jumpy and high-contrast. The color scheme of this map comes from the wooden pillars and beams of the Sheridan cafeteria. I think it is very suitable for a map related to the coffee brand. After so many attempts, I wanted to try to see what I would come up with if I just gave Mapbox a simple black and white. And I'm very happy with this final result, it's very minimalistic, practical and suitable for use in a wide range of scenarios. For this design, I used the main color scheme of my favorite game “Animal Crossing”. Surprisingly, the map I got was almost identical to the one I have in the game, which gave me a new idea. I chose a cyberpunk style reference image to arrive at this design. It's so sci-fi that one might even wonder if this is a real location. And that's exactly what I wanted. I used a piece of medieval art as a reference image for this style. I expected to get a dark, old style, but surprisingly, Mapbox generated a very modern and highly saturated contrast piece. This is a Christmas themed map. In addition to the main red and green color scheme, I purposely designed the green space to be white to simulate snow. For this design, I used gothic art as a reference image. Because I wanted to generate a dark, mysterious style. I made the water dark blue color, so when you look at the water part, you may even have a sense of breathlessness. In this attempt I changed the label font, I used a handwritten font that evokes the gothic connotations of this style. In this design, I used blue-green as well as white to create a marine style. It is fresh, light and relaxing, especially for vacation areas. In this exercise, I focused on changing the font as well as the text language. This way, the text part of the map not only fits the color scheme of the map better, but also can be used in different languages. This is my favorite design in Activity 1. I used the colors of poutine, a famous Quebec food, as a reference color for a map of Montreal. I specifically used white for the green space so that the green space becomes the cheese on the poutine and Montreal becomes a big plate of poutine . In this design, I tried to use the colors of BC's provincial flag as a reference color, as provincial flags can often represent a region. However, the B.C. flag was over saturated and I got a very exaggerated color scheme. Therefore, in this attempt, I learned that even with an existing design, we may need to modify and adjust it according to the needs when using it. A map style designed using the colors of Big Ben as a reference. The brown color scheme of Big Ben, and the blue iron cables of London Bridge, combine these colors to evoke London and England.

Assignment 2

The first bivariate spatial map made following Steve's tutorial 2. you can see that I have imported the data provided by Steve into Mapbox, but the color of the routes is not obvious. After changing the variables and the colors of the different data, I get this bivariate spatial map. However, I still find this representation not intuitive enough and need a lot of text to explain the meaning of the different colors and widths of the line segments. Zooming out the map, I get this effect. You can see that the data turns into colors and images. It's fun, and Mapbox is smart enough to suggest appropriate chart formats for designers. Coyote encounters map in Oakville.Because of the difference in the data, Mapbox recommended that I use a heat map. But for some reason, the expression of a heat map always makes me think of data related to viruses or disasters, and of course, a coyote encounter is also a crisis, so this kind of map can serve as a warning. Mapbox recommended me to use data driven circles. I trimmed some unnecessary data and adjusted the size and transparency of the circles to make the image more simple and easy to read. This time I tried to use a map of Montreal. And I found geographic data on leisure activities and clubs in Montreal. Surprisingly, there was so much data related to Montreal that it made the map covered with circles and took away the interest and confidence in editing the different data. So this exercise taught me that I should try to sift through concise data for my design. I have a problem when I first upload a GLB file to Aero. That is, Aero always alerts me to file errors. I tried to google the answer but no luck. It then occurred to me that maybe the Chinese in the file path was preventing Aero from reading the file, so I changed the file name to English and successfully solved the problem of not being able to upload the file. After solving the file upload problem, I imported Steve's file into Aero and got this interface. I really like Adobe Aero, because its files are uploaded to the cloud, which saves me a lot of hard disk space and allows me to use them on different devices. Learn how to adjust 3D models in Adobe Aero. I found that the operation in Adobe Aero is not exactly the same as in other Adobe software, so it is important to learn the tools in the toolbar on the left and become proficient in adjusting 3D models. My first AR attempt! I imported the 3D model I made in Project1 into Adobe Aero, and I'm very happy with the results. the projection of the 3D model and the lighting are very natural. The only challenge was that it was difficult to scan the horizontal plane in a small space. Often when sharing Aero files, there is also the problem of not being able to generate links. I looked up the information and realized that it is because Aero is still in the beta stage, so there are a lot of bugs, for the problem of not being able to generate links, the solution I found is to re-import the GLB file and re-generate the links. During the day, I came out to the backyard to try out Adobe Aero. I found Aero easier to scan horizontally and easier to work with in wider locations, as well as locations with high color contrast. This is what it looks like when I turn on the duck model from Project1. I scaled up the duck in Adobe Aero to get an exaggerated, interesting effect. I try to combine my 3D models with the real world. I found a crack in the ground that was perfect for inserting a screw. So I got this effect. But as you can observe, the edge of the screw is a bit fuzzy and the material is not clear enough. My analysis is that Aero can't resolve too much detail for the time being, or the GLB file is too big. In conclusion, 3D models are very important in Aero and need to be chosen carefully. As I continued to explore AR, I discovered a new problem. I saw a hole in the bottom of the can model I created in Project1 where light could come through. However, when examining the Cinema4D file, I did not see this hole. Therefore, I think that AR still has more uncertainty and may show different results than what is shown in the modeling software, so it is still necessary to create the model with care. I tried editing and modifying the 3D model directly on the Adobe Aero application for the iPhone. It was easier than I thought it would be, with basic zooming in, zooming out, moving, and rotating all possible. Since we don't have any other reference when editing Aero on the computer, sometimes the result doesn't match what we want, and by making adjustments in real time, we can more easily get the effect we want. I tried to put the cracker created in Project1 on my plate. Actually, AR is so interesting that we can place any model that makes sense and doesn't make sense in a real location. It can give us a PREVIEW (e.g. does this couch fit in my living room) or it can make a waterfall appear in the desert. I believe that AR will be a technology that will bring more convenience to human beings in the future, and it is also a very attractive area for creativity. Design a laser cut pattern using Illustrator. This was my first attempt at laser cutting. At first I thought that laser cutting is like 3D printing which requires a software like Cura for translation, but I didn't realize that I could make the pattern in Illustrator, which I am glad because I am familiar with Illustrator, and it will save me a lot of time. Started laser cutting. I was so excited and I was surprised that the laser cutting machine could cut such fine lines. And the machine cut in a different order than we thought, we thought it would cut one person's cell phone holder and then go on to the next person's cell phone holder, but it actually worked in the order of engrave to score to cut. My first laser cut piece. The problem we ran into before cutting was that our file appeared very much in other colors when it was ready to be cut in the laser cutting lab. This may have been because we did not set the color of the graphic when we converted the vector graphic. As a result, the parts that were supposed to be engrave were scored. Laser cut work by four of our group. As you can see, because the color is not set properly, the part that should be engraved is scored, and even some of the shapes are partly scored and partly engraved. at the same time, the spacing and size of the lines are also very important, if the lines are thin and dense, it is easy to see clearly. Use Mapbox to set the map to black and white, which helps Illustrator generate vector graphics. I chose me my hometown Shenyang as my final design map sample. Because I haven't been home for many years, I miss my hometown, and I want to use the knowledge and techniques I've learned to show my hometown in a new way. I will import the image generated by Mapbox into Illustrator. i will modify the lines and color blocks in Illustrator and change the colors to suit my design to ensure that the laser cutter can read the data and cut the effect i want. Then I realized that layering could also be done in Mapbox and would be easier. Final design requires many layers and some image decoration to make the work more beautiful and complete, so it is important to confirm the content of each layer. I made some sketches to confirm the content of each layer and more details. One of my ideas is to add Chinese traditional architecture graphics into my final design, more ideas will be added. I chose iconic buildings in Shenyang and combined them together to transform the skyline. They will be part of the border. I am also considering cutting and pasting these landmarks in specific locations to create a 3D effect. I plan to add some text on the final design. Because even if the map is shown, it will be impossible to recognize where it is for people who don't know Shenyang. Also, proper typography helps to show the style and origin of a city. I will keep improving the draft and exploring different ways of expression.

Spatial Workshop 1

Photographing Sheridan's library from outside the building. It has a very unusual roof, made of glass and assembled in the shape of a pyramid. I'm guessing this was designed to allow for better lighting, while also highlighting the unique design and artistry.

Our school cafeteria has always been one of my favorite places. The designers used colorful glass, which makes it especially eye-catching when there is sunlight. And as a place for people to rest and eat, the large amount of logs can make people feel relaxed and calm. Meanwhile, the split-level design of the cafeteria effectively separates the dining area from the lounge area, so whether you're lounging alone or dining with friends, you won't feel awkward or disturbed.
 Here is a corner of the hallway linking the two Wings B and C. I really like the way Sheridan's architects utilized every bit of space. This small space is furnished with sofas for lounging as well as studying. At the same time, it has a lowered design so that the space doesn't get in the way of people walking through the corridors, and people working in the space aren't disturbed. I've seen students selling their artwork here, which is smart because it's located in the connector, which is where a lot of people go, so more people can see their work and buy it.

Spatial Workshop 2

Our group chose to further research and design the space of the cafeteria. We thought the style of the wood structure in the cafeteria would be perfect for a pirate style or an Irish pub vintage style. So, we added barrels, oil lamps, and ropes to make the entire cafeteria look like a pirate ship. We worked well together, everyone gave different ideas and respected each other's ideas, and Wanyue's excellent drawing skills helped to bring our ideas to life.

We moved on to explore more possibilities. We agreed that there was a lack of greenery in the cafeteria. As a place for people to rest, greenery can be comforting and relaxing. So we designed a rainforest concept, we added various types of plants in the cafeteria, and we also referenced the design of the real rainforest in the Amazon headquarters, adding humidifiers to create a mist of water, which can make the people using the space more relaxing, as if they are really in the nature.
In addition to placing real decorations, we also stretched our ideas and designed the cafeteria as a virtual place. We added some pixelated symbols to simulate a gaming scene. We placed pixelated apples on the beams of the room, which the player eats to replenish the life value in the upper left corner. In a sense it also echoes the function of the cafeteria for people to have meals.

Project 2


Final Project 2 Design

I chose the laser cut map as my final design. I show part of the map of my hometown, Shenyang. And I chose four of the most well-known attractions that I personally think best represent the city of Shenyang, cut and glued them on the map.
In order to increase the interactivity and fun, I used Makey Makey and Scratch, when the user touches different landmarks, it will trigger the sound effects related to the landmarks, which are the sound of steel in the factory, the sound of stepping on snow, the sound of Erhu, and the sound of the crowd in the night market. This can give the user a more immersive experience, help them understand my city, and express how much I miss my hometown.
×

Powered by w3.css