Week 3 – User Research – Daisy & Milly

Survey/questionnaire/interview outline design/result

The purpose of this survey is to help us get a big image of our potential users. We want to figure out who might be interested in this kind of learning platform and what’s the touchpoint of these users. Milly and I worked together on discussing the questions of the survey, reaching out to

Interviewers and inviting people to take the survey.

Questionnaire/interview design

Personal information collection

To study how the personal experience might infect the learning experience, we collect information about gender, age, personality, job and major.

Learning experience

In this part, we aim to know more about the “goals” and “frustration” (two parts of the persona template) of our users. Therefore, we design questions to know more about what motivates them to learn, what’s their expectation of this learning activity and what kinds of the problem they encounter in the learning process so that we can take all of these concerns into account when designing the product.

The interview aims to collect qualitative data, so we choose people who are students, teachers and site providers in order to know more about their concerns and what might attract them to use this app.

Questionnaire/interview result(details see persona)

For the quantitative data, our questionnaire has received 95 answers this week. And for the qualitative data, we interview 2 teachers, 2 students, and 1 resource (like the site, equipment) provider.

Here are some charts that visualize the data we got from the survey:

            

Interview

The teachers’ attitude towards online platforms is mainly divided into two groups, willing to cooperate or not, especially for offline courses. Different types of teaching prefer different time-span: for example, music learning should be a long term learning while bakery could be just a one-time course. The main questions they concern are as follows:

  • The teaching fees (compared with they finding the student by themselves)
  • Platform’s credibility
  • Students quality
  • Environment: as most of the teachers don’t want to change their teaching places frequently

Most of the students are familiar with these online learning platforms and also willing to use them. The question they concern the most is the quality of the courses and the responding system of the courses. The group booking choice could be popular for most of them choose to study with their friends or classmates in school.

The resources provider is willing to collaborate with this kind of platform and prefer long-term collaboration. They are also willing to offer other resources like the equipment, teachers and drinks as long the price is fair, which is one of their main concerns.

Improvement

(Special thanks to the feedback of Prof.Azure)

  • Use simpler expressions and make the logic of question clearer for people to understand
  • The question setting can be more related to the functions of the app (need to have a more concrete idea of the app before)
  • Set the questions in sequence, from easy to hard
Persona

 

Week 3 – JavaScript Excercise -Daisy Chen

Link:http://imanas.shanghai.nyu.edu/~qc532/week03-js/

In this weekly assignment, I tried basic js functions (like loading img and innerHTML) as well as css learned previously. For the caption change part, I change each one of the style attributes in js (fontsize, border,etc). I wonder whether is an easier way to make it. For example, change the css style of one box with one line of code in js. It also helped me understand the difference between id and class. Class is more often used in CSS while id is more often used in js (maybe).

  

Week 3 – comic idea -Daisy&Anica

Introduction

Inspired by the movie Life of Pi, our group would like to tell a story about someone adrift on the ocean and his/her experience on the journey. To make the content more meaningful, we want to combine that amazing experience with the topic of “(un)sustainability in life below water”. More detailed information can be found below:

Storyline

A boy (or girl, TBC) left his town because he wanted to experience something amazing outside. But somehow his compass got broken in half way. He lost his direction, adrift on the ocean.

It was about five days before he saw the huge iceberg. He was so surprised to see the Titanic passed by. After that, he got to meet a polar bear, “who” was really friendly and ready to go fishing and share the food with him. He also came across a group of whales, who were singing freely with such beautiful voices……We’re still working the end of the story. Here is one version: One day, however, when he turned around, all of them just disappeared! He suddenly opened his eyes and found it was just a dream. What he actually saw was that the whale was stranded by the receding tide with plastics twined on its body; the polar bear was dying due to the lack of food; Garbage just piles up over there……

Interactivity

By scrolling the page they can change the view and see the narrations of different scenes to learn about what’s going on.

Telling in a third-person perspective, the reader will be the companion of the main character and control his interaction with “NPCs” he encounters. Different decisions will result in different endings.

The weather condition on the ocean may also change with the story goes on.

—————

Introduction:

Our second idea is about to tell a story using the first-person perspective of a dog(or cat, TBC). The reader will follow the dog to fully emerge and experience its life. In the world of the dog, things might be very different from what we see as human beings. The noise may be much more annoying for the sensitive pet.

Interactivity

The reader can interact with the character and environment as a dog. For example, when it feel the sound is too annoying or the food is not enough, they can choose to bark or do something else to attract the master. It can also wag the tail and welcome the master when he/she comes back. When the master feels upset, it can sit next to the master and let him/her pet it. We are also going to make some scenes that the reader can’t do anything with it. For example, when the dog is abandoned on the street and bullied by others. As a dog, it’s unable to cope with these people. The feeling of helpless can be conveyed through the scenes when the reader can’t fight back.

Significance

Through this story, we aim to draw people’s attention to care more about their pet. To treat them as a friend and not abandon them easily. We as the master may have other friends but for the dog, we are the only one they can rely on. Meanwhile, we also want more people to pay attention to the homeless dog and cat on the street that they might overlook in daily life. By raising their awareness of this issue, more and more people can join to save and help these homeless dogs and cats.

Week 3 – Basic HTML/CSS website – Daisy Chen

Link: http://imanas.shanghai.nyu.edu/~qc532/week03/index.html

Process:

screenshots of pages made in week1

  

I firstly fixed my last assignment about the basic css exercise.  Since I used “margin to left” in the content part the whole content didn’t appear in the right place.

screenshot of the intro page

Based on the assignment of week 1, my portfolio website includes three pages – intro (index.html), project and about. I spent most of the time on the intro page. To present in a simplism style, I only put my Chinese name and the English name on it. Instead of linking to “contact me”, I put the icons on the left with links to my social media accounts. To achieve this effect, I learned to use the FontAwesome which is a useful font providing different icons and I can edit them the same way as editing the font. I also tried the hover attributes so that the color will change when I put the mouse over the icons.

For the navigation box, I used a simple animation effect learned from online tutorial which pops up a line when the mouse hovers on the content. Attributes included are the transition and transform. It also took some time to refine it by trying different opacity and time.

I put my Chinese and English name on the right of the page. Since I tried to make an overlap effect of these two, I set them in different classes and add different styles concerning font-size and opacity.

The background image bothers me the most. At first I set “height:100%” for the gradient in the background but when it’s not full screen there will be a black row under the page. The reason is that the flexbox used to display the content will change position according to the size of the window while the background won’t. So if I use just background color it will be fine (because it will repeat and the edge of the image is not as obvious as that of gradient) but can’t make it using background-image. Now I know why most of the websites just use white or other colors as the background instead of gradient 🙁

For now, I just used color as the background to avoid the weird blank block on the bottom in other two pages. I also changed the color of the link when hovered according to the different background color. The similar effect is also applied to the box on the project page.

background before adjustment
blank on the bottom

The about page and project page follow a similar style as the intro page as well as the one we’ve done on the previous assignment. I changed the text-decoration, the font type and add some photos to these pages. I left the project photos blank for now. (Hopefully I can fill that page after this semester.) Finally, I add the footer and deal with the problem to make it stay on the bottom by set the height as auto.

screenshot of the about page
screenshot of the project page

Week 2 – Response to “Understanding Comics” by McCloud- Daisy Chen

In “Understanding Comics”, Scoot Mccloud gives many intriguing insights into the comics as an art form. It enables readers to better understand how the comics convey the ideas and how the comic readers perceive and process these ideas.

This book taught me about the way time and space are presented in the comics. Unlike film or photography which capture a single moment, time in the comics is like a rope. In comics, it’s possible to present different points in the timeline within a panel. And the panel itself also makes a difference in altering the perception of time. For example, using a longer panel and bleeds brings the feeling of time being expended.

I also learned about the difference between comics in the east and the west. While American and European style comics might focus more on depicting the motion, Japanese comics focus more on presenting a “status”. In McCloud’s word, is “western art emphasize being there over getting there” (81) and the eastern art which also emphasizes the “things omitted” is “the art of intervals” (82). This also reminds me of what is called “留白” (leaving blank space) in traditional Chinese painting, which aims to give more room for the audience to complete their own imagination about the painting, namely the invisible idea behind the work.

The imagination, or “closure” in McCloud’s word, is an essential part for understanding the readers. The ability to compete the invisible story gives the comic artists more room for different types of expression between the panels, especially the “non-sequitur” which offers no logic relationships between the panels (72). Meanwhile, the interpretation about how we perceive the message in the comics echoes our last reading – “The Medium is the Message” by Mcluhan. The comics as a medium carries the message. And the way comics present this message using abstract icons create an empty shell for us to easily put our identity in it and become the character. Though McCloud uses this to explain why people are involved in cartoons, it’s also suitable for the case of the comics. As Mcluhan suggested, the way people interact with inanimate projects is to include the object of our extended identity (39). As a self-centered creature, we human beings are able to project our self-consciousness into everyday objects and “become” the objects. This allows readers to get within the world. As for the comics artists, their aim is to enhance this engagement.