The final project for the Visual Design and Culture course required us to produce a work of “Design Fiction”. We had the option of either creating a product that builds upon nanotechnology research, or explaining a concept or issue in nanotechnology by drawing from science fiction. My team chose to go with the first option of creating a product concept because we all had so many fun ideas that we wanted to realize.

Ideation

My teammates and I brainstormed by each making a list of things that excite us about nanotechnology. I was particularly drawn to the idea of information access anywhere and anytime without being tied down to a specific medium. This idea was inspired by a recent visit to the augmented environment lab on campus, where I saw how our daily experiences can be enriched by information that can be dynamically linked to physical items. After discussing with my teammates, we all resonated with the idea of having a portable device that keeps a person connected to elements of both the real world and the augmented space. We wanted to create something with a display that helps people to access information, share information, and to collaborate with each other very easily. Some of the technologies we initially examined as basis for our design include:

• nanorobotics
• use of photonic crystals as a source of power
• nano manufacturing
• nano projection
• air-based display
• nano color filter
• holographic displays using nanotubes
• cloud computing

Scientific Research

Building upon our initial idea, we took a more in-depth look at the various nanotechnologies we can leverage to create our product. We understood that in order for our product to be believable, we need to ground it in sound logic and plausible science. We outlined the main areas of concern we need to address for our product to be feasible, and dove into the following topics:

• high-definition and super thin display
• flexible and expandable material
• self-directing sub-units that can form larger units dynamically
• nano sensors
• self-powering

The following embedded slide show is the presentation we prepared on our scientific research.

The feedback we got back from the class critique based on the above presentation were mostly focused on the use of nano manufacturing and nanorobotics technologies, mostly because those technologies are still in a very nascent stage. We decided to limit the scope of our usage of these technologies and more fully develop a few scenarios so that our product can be more well-grounded. For example, we originally had the idea of our product being built from a single nanorobot on the go, but we cut that feature because it would involve a lot more research on nano disassembly, on which we were unable to locate much useful information.

Correspondences with Undergraduate Counterpart

For the purpose of this project, we were asked to collaborate with the undergraduate students from a science and technology studies class. We were matched up with those students who were interested in the same area of nanotechnology. Essentially, our counterpart would loosely server as our client, providing us with feedback during a few stages in our product development. We were paired up with Brandon, who was interested in creating a fictional work that describes a world that uses nanotechnology to communicate with each other. We received very helpful feedback from him on our scientific research work. This is the response to his feedback.

Product Concepting and Planning

Target Audience

We wanted to start out with a few user scenarios of our product to make it believable. We initially picked students as our target user because we can relate to the students. We chose our key scenarios based on a day in the life of a student – getting ready for classes, doing a class presentation, meeting up with friends on campus, and collaborating on projects. We asked our professor for feedback on those scenarios, and he advised against using students because we would essentially just be designing the product for ourselves. After more discussion, we finalized on using the medical professionals as our target users. We felt that a hospital setting would allow us to highlight some unique features of our product – super-high resolution, novel ways of information sharing, and collaboration.

Scenarios

To come up with our scenarios, we first discussed the possible features we could showcase and came up with the following list:

• able to range in size from 24 x 36 (poster size) to wristband size
• able to receive and transmit radio frequency
• able to capture video and sound
• able to mimic material texture
• able to be split up and merged together
• able to copy and paste information through physical contact
• provides haptic feedback
• liquid-proof
• super high-definition

Other aspects of the video we considered before creating the scenarios included the type of flow we wanted to have, the feel we wanted to achieve (personal vs. professional), and the time frame of the video. We understood the importance of showcasing our product as an indispensable tool for the medical professionals, and wanted to, at the same time, add a personal touch to it, to convey its versatility and universality. The finalized list of scenarios is as follows:
• Before the surgery
  • the surgeon and a nurse go through the surgical plan
  • the nurse shows the surgeon that the nanocameras are already set up inside the patient’s body to monitor his conditions
• During the surgery
  • the surgical team uses the merge feature to layout all the vital information for the surgery
  • the surgeon zooms in on the screen to examine an x-ray of the cancerous cells
• After the surgery
  • the nurse monitors the patient’s conditions and easily copies his vital status using our product
  • After waking up, the patient chats with his daughter using our product

Designing and Planning Our Presentation Format

Using the video format to convey our concept had been our unanimous choice since the beginning. We got our inspiration for this format from the Morph video. However, unlike Morph, we decided to have voice over for our scientific explanations because it would allow us to clearly communicate our idea in a shorter clip. Based on the previously decided scenarios, we planned out the content on a rough frame by frame scale, mapping the scientific scenes to their corresponding illustrated scenes. Since Christine is the only one on the team with hand-drawn illustration experience, she would focus on narrative illustration. Jing and I would split up the scientific illustrations, assemble the scenes, and be in charge of all the required sounds.

Implementation

Phase 1 – Exploration

We dedicated about a week of time to explore the various styles and tools we want to use for our illustrations. For the narrative illustrations, we looked various animation styles online. We wanted to go with a more realistic style instead of something more cartoon-like to make our product more believable. Also, we settled on a very simple and bare color palette for the characters in the scenarios in order to accentuate the vibrant display of our product. On the scientific illustration front, we also did some explorations on the web, and the following images were some of the ones we used to come up with our final look:

Color filter image

Layered look of color filter

Using some images such as the ones shown above, I tried to create a sample look for our nano filter illustration in Photoshop. During this process, I quickly realized that to clearly demonstrate the scientific facts, we need to have multiple images of the filter at various angles, which is something that cannot be done easily in Photoshop. Jing suggested using 3Ds Max Studio to create all of our scientific scenes instead. Considering my lack of experience with either Photoshop and 3Ds, and what 3Ds has to offer, we decided to go with 3Ds. While I was learning my way through 3Ds, Jing decided to experiment with the lighting support provided by After Effects. As a result, we updated our task breakdown to me being responsible for creating all the scientific scenes in 3Ds, and Jing would polish up my 3D renderings in After Effects.

As for background music, we were lucky to have found a short piece of music composed by a friend. It turned out that the length of the music matched exactly to the video we had planned at that stage, so no further editing was necessary.

Phase 2 – Creating Introductory Scene for Class Critique

We tried to make most of our design and style related decisions through the process of creating our introductory scene so that we have something to work off from. One of the important decisions we had to make at this point was to come up with a name for our product. We looked at its unique qualities and the scenarios we are depicting in our video For this scene. It was clear to us that our product helps people to connect with each other and to the information around them. Thus, we eventually came up with the name “Link”, both because of the message it conveys, and a certain ring to this word.

For this scene, I needed to create a series of images that introduces the viewers to the idea that Link is made up of nanorobots. My initial thought was to have a different look for each type of nanorobot, depending on its functionalities. However because of its complexity and our time constraint, I settled on using spheres to represent the nanorobots. The following image is from the short clip we created for our design critique presentation that shows the concept of nano-pixel resolution offered by our product. The blue and red sphere were colored in Photoshop.



Size comparison between a normal pixel and a nano-pixel.

This is the posting for the presentation we created for the second design critique. Most of the feedback we received were regarding the scenario in which we illustrated the patient communicating with his daughter using Link. People felt that the way we communicated the role of nano-sensors in imitating material surface was not clear enough. As well, they thought that we were trying to introduce too many new features in our final scene. In response to the feedback, we decided to lengthen the introductory scene in order to briefly describe all the features of Link before demonstrating their usages in the subsequent scenes. This would also give the viewers a better understanding of what Link actually is, since a lot of people in the class were a bit confused by the purpose of Link. In addition, people felt that the pace of our video was too fast, so they missed out on a lot of the transitions. As a result, we stretched out a lot of our scenes by a factor of 1.5.

Phase 3 – Finishing the Rest of the Scenes

I created the rest of the 3D scenes following the same style as what was in the introductory scene. I was able to improve the looks of the scenes as I was learning more and more about the various features in 3Ds Max Studio. For example, I initially only applied a color to the spheres representing the nanorobots. After I learned to use the material library, I went through my earlier scenes to add the same material to the sphere so that they have a more uniform and polished look. The following image is the updated version of the one I chose earlier from the introductory scene. Instead of using Photoshop to color the spheres, I applied material to spheres, which also allowed me to create animation that more clearly delivered our message.



Final version of the image showing the comparison between pixel and nano-pixel.

Since Jing was the one polishing up my 3D renderings, I received a lot of feedback from her in terns of the angle of the cameras and the pace of the scenes. For example, because we were using a 2:1 ratio for the dimensions of our images, some of my 3D images ended up being cut off at the top. Therefore, I had to rearrange the elements in the scene to leave sufficient space on both the top and the bottom of the images. Another common feedback I received was that some of the special effects I tried to achieve were not obvious enough. To address this concern, I purposely slowed down the animations used to highlight interesting features and increased the contrast between those and the rest of the images.

We also recorded our voice over with the help of our TA. Since we had already created our script during the initial planning phase, it was a simple task of editing some of the lines and get Christine to read out those lines. The quality of the recording was good enough to not require any further editing. All we had to do was splicing up the sections to match up with their corresponding scenes.

Throughout this phase, which took about 2 weeks, we met up frequently to work together and give each other feedback. We also continuously evaluated our progress and tried to keep our project within the scope of our vision. We created a separate Flash file for each of the scenes to enable modularity in our work.

Phase 5 – Putting Together the Scenes

Although we ran into various problems during the previous phase in creating our scenes, this phase definitely posed a lot more problems than we had anticipated. It was relatively straightforward to add the few scenes that summarized the features offered by Link to our existing introductory scene. They were simply attached as new scenes in our Flash-based movie. However, once we started to add scenes that are more significant in size due to the 3D renderings and illustrations, we consistently experienced Flash crashing due to memory shortage.

The first solution we tried was to cut down on the size of our images by reducing their quality. However, the reduction was not significant enough to have made a difference. We then examined various options for loading a sequence of swf movies. After Effect initially appeared promising, but the random lags in the video ruled out that option. There were also a lot of resources online for creating a container Flash file and dynamically preloading a list of external swfs before playing them. However, the size of our files continued to be our blocking issue. Thus, we made the call to downsize our movie from 800 x 600 to 640 x 480. This required us to resize all the illustrations, re-render the 3D scenes, and re-create all the scenes that used those images in Flash. Although it was looking promising with the use of a loader and the smaller movie size, we hit the wall again after loading in a few more scenes containing 3D renderings. At this point, our TA suggested to us trying exporting our swf movies as mov or avi format and stitch those together. We understood that we would be sacrificing the quality of the images when our movies are compressed and converted from swf to a different format. However, in the best interest of having a complete project, we decided to go with the exporting to avi option. We experimented with various export settings and found a configuration that resulted in surprisingly small-sized files while maintaining an acceptable level of resolution. Finally, we were able to put all the avi movies together and added in the background music using Windows Movie Maker.

Final Product

This video embedded below is our final product.

We received feedback from our undergraduate counterpart, Brandon, on our product, link. The feedback was mainly based on what that he knows about our product through our brief meeting and our scientific research presentation slides.  During our initial meeting, we described our rough idea for creating a display-related product. Due to the time constraint of that meeting, there are some mix-ups regarding our product, all of which are evident in Brandon’s feedback. I would like to clear up those mix-ups and also provide an update on the concept of our product. Keep reading

For the second round of critique, we got feedback on our conceptual product, link, by showing a short clip of our video in progress. We felt that although the clip is incomplete, it conveys our design decisions and ideas much more clearly than static images and words alone. The excerpt gave an introduction to link. We further explained our concept using the following slide deck. Our presentation mainly covered the user scenarios we are exploring and the main technologies associated with each of these scenarios. Keep reading