Category: Cici Liu

Posted on

Week 3: Portfolio Website w/ CSS – Kimmy Tanchay

http://imanas.shanghai.nyu.edu/~kct285/Portfolio_Kimmy/

For the front page of my webpage, I decided on a landscape picture that I took in my recent trip to Seoul, Korea. I chose this picture because I really enjoyed the colours and the ‘rustic’ feel of the city with its traditional houses and roofs. I went for this picture as a background instead of just a plain colour or picture/gif that I would’ve gotten off the internet as it conveys more significance to me and my own experiences. For my font choice, I went with this simple monospace font from google fonts for a more minimalistic look.

I decided to go with a very simple navigation bar: a white background with my “about”, “projects” and “contact” turning an orange colour, to match the background picture, when the mouse is being hovered; I also utilised the fixed position so even when the user scrolls down, the navigation is still seen. Initially, I wanted to have a more complex effect on my navigation bar. Unfortunately, I couldn’t figure out what was wrong with my code so just settled with the simple colour change when the mouse hovered. I also included “scroll-behavior: smooth” for a better flow to the different parts of my portfolio website for when my navigation buttons were clicked.

For my “about” section, I have a small description of my hobbies, background and interests. I decided to make my about-picture in a rounded frame to mimic the way many social medias show profile icons (EG instagram) and I was happy to know that this was possible using only one line of code on CSS.

Perhaps the most difficult and time consuming section for me is the “projects” section. I knew exactly what I wanted this section to look like however, executing it was much harder than initially thought. After getting past some confusions with flex boxes, there was another problem of figuring out how to hover text over an image. After a lot of trial and error, I realised I didn’t group the images and text individually and had some errors with CSS properties like positioning and div classes.

Fortunately, my “contact” section was relatively straightforward in which I used simple icons as buttons to lead to my social medias, email and linkedin. Initially, there was 2 tiny annoying lines that showed up next to my icons but after more trial and errors, this was fixed with setting my text decoration to none. 

Overall, I thoroughly enjoyed making my own portfolio website despite it being a painstakingly tedious and brain-crunching process. I felt extremely satisfied especially when I finally fix problems with my code and in the end, I’m happy with the end result.

Posted on

Week 3: CSS Updated Portfolio- Cara Chang

http://imanas.shanghai.nyu.edu/~cec717/portfoliosite.html

When I was adding CSS to my portfolio site, I came across a problem where a color block appears at the bottom of the screen. I plan on asking for help in class to resolve the issue. Besides that, I also had some trouble getting the link to work,  but after deleting old folders and organizing my work in a separate folder, I got the link to work. I fixed the original grey colors of the boxes to match my blue themed background color. 

Posted on

Week 3: CSS Portfolio- Jikai Zheng

Link to CSS Portfolio

Styling with css is very tricky, but also very rewarding. My old portfolio now has some delicious-looking colors, a snazzy font, and an orderly layout.

It took me a few tries to understand that I should put my whereabouts and favorites into different divs, and then into a compound div to get the side by side flexbox layout that I wanted. But, thanks to the help of IMA fellow Tristan, I was able to get my webpage looking more structured. 

For the colors, fonts, I already preset that before I went to anyone for help, because that’s actually the fun part, and it’s not as tricky. For the colors of the font and background, I did something really special. I found an image of some nail polish from a blog post somewhere on the web, and I uploaded it into photoshop, so that I could color pick the colors on the nails and then use those numbers in my css. 

An additional component I really wanted for my webpage, is for the links to go to a new tab instead of taking the place of the current tab. I also learnt to add links to pages that I personally made within my webpage. Previously, I only linked to other website’s webpages, but now my whereabouts and favorites go to their own pages, albeit they’re the same information, just different in how they’re centered. 

Anyhow, I believe this was really fun to do, and I look forward to utilizing the skills I learned in the interactive comic project. 

Posted on

Week 3: “Understanding Comics” Response – Samanta Shi

First of all, I love that McCloud decided to write about comics using its own medium!

In the first few chapters, McCloud introduces us to various drawing techniques used by artists to convey meaning. I particularly enjoyed when he discussed the phenomenon by which we view objects as extensions of ourselves, such as a hat or a car: “the vehicle becomes an extension of our body. It absorbs our sense of identity. We become the car” (38). I can definitely relate to this, as someone who rarely—almost never—misplaces things that I own (I will almost always know where something is).  Before this reading, I had never really thought of comics or cartoons as deeply as McCloud discusses them and the different styles through which artists can communicate different messages, touching upon the psychology of their audience.

I also understand why McCloud decided to draw himself in such a simple style, as mentioned on page 36. My immediate reaction to the more detailed and realistic drawing of himself was “Oh, that’s what he looks like?”, and for some reason, for just a second, the tone of the narrator’s voice felt like it had changed–it felt more biased.

As someone who does not read comics, reading “Understanding Comics” was not only an adventure into McCloud’s mind, but also an exploration of how he utilizes the medium to convey his message. I was impressed not only by his artistic skills, but also by his use of space–and references to human psychology–in order to tell his story.