Team:Wellesley Desyne/Notebook/CatherineNotebook

From 2013.igem.org

Wellesley HCI iGEM Team: Welcome


Contents


Week 1: May 28 - May 31

Tuesday: First day of work at the HCI lab and I'm already starting to work through background readings. I was assigned to the Eugene DeSyne project, and the background readings address first-order logic, a topic that I know nothing about. I'm struggling to understand the symbols involved in logic, but I'm sure I'll come to understand it in time. There's also readings about visual languages, which is quite intriguing for someone coming from a linguistics background.

Thursday: The Wellesley iGEM team visited MIT for a BioBuilder workshop with Natalie Kuldell. Unfortunately, as a graduating senior, I had other activities to attend to and I was unable to stay for the afternoon wet lab workshops. In any case, the morning lectures were helpful at providing an introduction to synthetic biology, especially the goals that people in the field strive to achieve through experiments and research.

Friday: Graduation at Wellesley! I received my diploma with a B.A. in Linguistics, but I'm not quite leaving Wellesley yet. I'm excited to spend the summer working at the Wellesley HCI lab before moving on to the next chapter of my life.

Week 2: June 3 - June 7

Monday: Today we visited BU to meet the BU iGEM team and learn more about synthetic biology. The team presented a general introduction to synthetic biology and after lunch, we began learning about Eugene, a domain specific language for synthetic biologists. As someone with very little programming background, understanding Eugene was rather difficult. Already I could notice the different ways BU and Wellesley students approached solving problems, and it was interesting to work with a group of students who have extensive experience in a wet lab.

Tuesday: Day 2 at BU! Today, we presented our proposed projects to the BU iGEM team, and they provided feedback to us. The presentation could have gone more smoothly, but we learned a lot from hearing what the BU team members had to say. They definitely view our projects in a different light because they come from a strong biology background. I enjoy hearing input from people who come from a variety of backgrounds, which is something I had experienced when I participated in a program that involved students from Babson, Olin, and Wellesley Colleges this past January. Afterwards, we went on a tour of the BU wet lab and saw their high end flow cytometer. Pretty nifty!

Wednesday: Today, the Eugene DeSyne team (now with the addition of Sravanti) spent the morning learning more in depth about the previous incarnation of the Eugene DeSyne project, which was in paper prototype stage. Afterwards, we made a list of things we liked and didn't like about this previous incarnation, and started thinking of new designs to improve upon this model. We were thinking of incorporating windows that can be hidden and revealed to free up screen space, rather than leave a clutter of windows all over the screen. At the end of the day, I participated in a user study for another project going on in the HCI lab, Tabula. It was interesting participating in a user study that was very open-ended, but having experienced a user study before, I knew how to verbalize my thought process and make it clear to the experimenter what I was envisioning. A long day of work today, that's for sure.

Thursday: Today, I joined the Tabula team to help out with running user studies. I had expressed interest in user testing prior to beginning my summer job at the HCI lab, so I was glad to have the opportunity to experience the experimenter's side of the study I just participated in. I read up on some background information on Tabula, and then in the afternoon, we had several user studies scheduled back-to-back. I was responsible for transcribing the dialogue, and it was interesting to hear what other users did to accomplish the same tasks I had tried the previous day.

Friday: Basically today involved user studies scheduled back-to-back from 10 am to 5 pm, and I led most of the studies today. It was quite nerve-wracking to make sure I was explaining the task clearly without giving subtle cues that could implant a bias in the participants' ideas. I also needed to make sure they were providing thorough descriptions of their intentions, otherwise the testing session would be unproductive. I think I did a good job running through the studies, especially for a first-timer! As there were studies going on all day, I had plenty of time to practice and refine the process.

Week 3: June 10 - June 14

Monday: Concluded user studies today! Also caught up with the Eugene DeSyne team's progress during the time I was working on the Tabula user studies. Orit suggested that we focus on developing new ways of visualizing rules, rather than continue refining the general user interface. She mentioned that we should draw inspiration from UML and the bio-visualization used in MoClo Planner. I'm starting to realize it's kind of difficult to create new ideas when you've become so invested and attached to a single design. I'm going to have to learn to let go of my ideas and try to create new ones with fresh eyes, lest I go through the 5 stages of grief every time an idea is shot down and torn apart.

Tuesday: Started developing our "tree" visualization of rules. This is in addition to the "icon" visualization, in which we created icons to represent components of rules. We tried to apply this visualization model to rules developed by Swapnil, a postgraduate researcher at BU.

Thursday: Prepared for our presentation to BU on Friday by drawing up posters that demonstrate our icon and tree-based visualization models. We made sure these visualizations could account for Swapnil's rules, which specify constraints such as order and part type.

Friday: The big day! The BU team visited Wellesley campus and we presented our projects to them. The brainstorming session was very helpful--many sticky notes were used and pasted over the white board. For Eugene DeSyne, we found out we were focusing on the wrong level of device development; we developed for Level 0 design, whereas the BU team was looking for Level 1 and Level 2 design. However, they seemed to really like both our icon and tree-based visualization models. I think we're going to have to rethink our visualization models to accomodate Level 1 and Level 2 design, though.

Week 4: June 17 - June 21

Monday: Finally starting development on an actual product! We're diving into creating a web app using HTML, CSS, jQuery, you name it! But first...I needed to go through tutorials on HTML and CSS. I had some brief experience with HTML and CSS when I had a Xanga blog back in middle school, but I don't really count that as web design experience. By the end of the day, I got the hang of how HTML and CSS work together to create web pages.

Tuesday: We held another brainstorming session while Tiffany and Evan went to meet with the Eugene team at BU. We came up with yet another idea for a user interface (I'm starting to realize there's lots of iteration involved in user interface design!), and we fleshed out the specific components we need before building our product. Better to plan out a general outline before building so we don't wind up working with spaghetti code.

Wednesday: I practiced more HTML and CSS by creating a "home page" for users who log into our web app, Eugenie. I'm really starting to see how HTML and CSS work in tandem to create web pages. You really can't have one without the other.

Thursday: Half the Eugenie team had been working on drag and drop since Monday and today they continued working on adding more functionality to their project. I was involved in creating a paper prototype and recording a video of how we expect Eugenie to work for preliminary demonstrations.

Friday: Continued working on our web app, and ended the day with a group dinner at TGI Friday's and then going to the movies to watch Monster's University. Great end to a productive week!

Week 5: June 24 - June 28

Monday: The layout of our web app needs to incorporate multiple "views", so the main display needs to be divided into sections with sliding bars to adjust the size of each section. We also need dynamically updating divs so each section can "live update" when one section is changed. Apparently this is a lot trickier than it seems, because we've been using jQuery, which is tricky to use with dynamically updating elements.

Tuesday: We're learning about using AngularJS in addition to jQuery to guide our development of Eugenie. It's kind of overwhelming to learn yet another JavaScript framework after just starting to learn jQuery. I'm going through tutorials online in the hopes of understanding how to program using AngularJS.

Wednesday: The progress of our project seems to be at a standstill. Morale is low as we continue to struggle incorporating drag and drop into the web app. Apparently, on its own, drag and drop works, but once the code is added to the HTML, CSS, and JavaScript files, it is not functional. Today, a representative from zSpace came to give a presentation about zSpace, in particular how the hardware works in conjunction with the software. It was quite amazing to see how they were able to make the 3D glasses so lightweight, and how they made the physics of moving objects with the pen is so realistic and intuitive.

Thursday: Today we went to see a talk given by Michelle Borkin (http://people.seas.harvard.edu/~borkin/) about her work on data visualization. It was a great talk, especially because it was so relevant to the work we're doing in the lab. She mentioned a piece of software that she was involved in developing that has the capability to display multiple "views" of the same data, as well as highlight areas of corresponding points of interest--this is exactly what we want to happen in our program, Eugenie. She visited the lab and we were able to talk with her in person. She mentioned that her work is very similar to human computer interaction research, since we both heavily rely on user studies to dictate the path of our projects. It was great to have the opportunity to show her our work and hear her input on our research.

Friday: Outing with BU iGEM at the Museum of Fine Arts. The samurai exhibit was quite interesting and awesome to look at!

Week 6: July 1 - July 3

Monday: Well, it looks like we're moving on to making the application a surface application that can also be used on tablet devices. Based on careful consideration of time limitations and the abilities of our lab group, we decided to put our efforts towards making a surface application. A web app would be the most accessible format to create, but the limitations of our working time makes this project an extra challenge. Looks like we're back to the drawing board! Even though we're abandoning the web app, we learned a lot about programming and design in the process.

Tuesday: More brainstorming! After deliberating on the backend and front end elements of our program, we created a paper prototype showing our updated vision of the final product for our application. We then recorded a video of this prototype to show to BU.

Wednesday: Heading home to New Jersey for July 4th weekend!

Thursday: Happy July the Fourth!

Week 7: July 8 - July 12

Monday: Today I finally got a major programming task to accomplish for Eugenie: making the shutter panels that will display the different views of Eugene code. To reach this goal, I have the help of Evan, who has the programming background that I lack. We are also responsible for editing the look and feel of Eugenie. I spent part of the day looking over the code already present in Eugenie in order to familiarize myself with coding practices in C#.

Tuesday: Today was spent figuring out how to make sliding panels snap to specific locations on the screen in positions relative to each other so they don't overlap and obscure the other sliding panels. We have been referencing the code for our team's iGEM project last year, called MoCloPlanner, which also included sliding panels.

Wednesday: Snapping panels work! For now they are hard-coded, so they will not position properly in monitors of different sizes. Today was spent working on making the “tiles” in the tree view snap next to each other so the tiles can connect in an ordered fashion. I spent quite a lot of time figuring out how to do this, but I was determined to program this function from scratch.

Thursday: Snapping tiles finally works! It's based on finding the center point of the tile that the manipulated tile will snap to, and then updating the appropriate center coordinates so the tiles “snap”.

Friday: Starting to figure out how to move snapped tiles as a single entity, i.e. once tiles are snapped, they should be treated as a single unit when the user selects and drags the multiple-tile object. This is so the modular aspect of biological devices can be visualized in our "tree view".