Team:Wellesley Desyne/Notebook/HeatherNotebook


Wellesley HCI iGEM Team: Welcome


Week 1: May 28 - May 31

5/30 - MIT Bio Builder lab

MIT Bio Builder Lab

Day one of biology boot camp at MIT was a fun and instructive initiation to the world of synthetic biology. BioBuilder founder Natalie Kuldell structured the day with lectures and lab activities that helped to introduce and explain some of the basic concepts, practices, and goals of synthetic biology, showing some of the current developments in the discipline as well as possible future implications. The experience of being in a lab and hearing the perspective of a scientist/educator in the field provided valuable insight into the engineering process (the design, build, test cycle) and also the attendant possibilities and challenges. It was interesting to see that like computer science and engineering, design in synthetic biology relies upon standardization, abstraction, and synthesis to facilitate the process. This parallel helped to illuminate some of the needs and challenges faced by synthetic biologists, such as moving through the abstraction levels of complex systems, and showed areas that could benefit from the development of new design tools.

It was especially insightful to go through the lab experience from the perspective of one with limited prior experience in biology. It provided a better appreciation for the process of learning and discovery, and also the limitations and frustrations of a novice scientist. Since the project Joanna and I are brainstorming is a visual and interactive piece that is focused on outreach, our assumed audience is the inexperienced scientist. So, many of the same feelings and trepidations we had in the lab are probably also the feelings that this user group would experience. As we went through the protocols, we sometimes felt overwhelmed because the process wasn’t completely clear to us, but we collaborated, asked questions, and used our logical assumptions to follow through. We did sometimes feel that we were moving mechanically through motions and wished for a better understanding of what we were doing, which might indicate something to consider when developing our project. There is the future challenge of making the process of synthetic biology relatable, informative, exciting and interactive for the inexperienced scientist all at once, while limiting the frustration that comes from inexperience.

Week 2: June 3 - June 7

Monday - Tuesday: We spent the past two days at BU, getting to know our collaborative partners, learning more about synthetic biology, and working with the Eugene programming language. Both teams presented their projects and potential projects for the summer. It was interesting to see the underlying processes of a wetlab team, and we received some helpful feedback as we continue to brainstorm and research.

Wednesday - Thursday: Joanna and I continue to develop and expand upon our ideas. Our research has uncovered some really fascinating projects and developments in synthetic biology from which to draw inspiration. We continue to think about the various intersections of synthetic biology with the environment, energy, ecology, and art.

Week 3: June 10 - June 14


Monday: This morning we met with Orit and presented our preliminary ideas. The advice and guidance she provided was so helpful and instructive. We are beginning to feel like our ideas are taking shape, and are going to begin thinking deeper about the synthetic biology concepts we would like to convey and the details of user interaction.

Tuesday - Wednesday: Joanna and I have been creating preliminary storyboard rough drafts. We chose three of our ideas to develop further, and have begun to think about the details of implementation. As we think deeper we are discovering new possibilities and challenges, which are helping to inform the ongoing direction of our thought process.

Thursday: Today we revised and edited our storyboards, fleshing out more details and phases and critically thinking through the different possibilities. We then created more comprehensive “final” drafts to use in future planning. As we prepare for the collaborative brainstorming session tomorrow, we are also compiling our sources of inspiration, and organizing the various sketches, notes, and products of our many previous brainstorming sessions.

Friday: Group workshop/brainstorming session with the BU iGEM team.

Week 4: June 17 - June 21

Monday: After looking over our notes from Friday’s brainstorming session, Joanna and I discussed our project possibilities and made a final decision. The project we decided to implement is an art installation/application that explores the idea of DNA as a universal language, and its potential to encode information. We spent the remainder of the day storyboarding and discussing the details of implementation, including technology, programming strategy, and user interface.

Tuesday: We further discussed implementation details and evaluated the pros and cons of various implementation strategies. After some group consultation, we have decided to create an installation version and also a web demo version for wider distribution. Now we are going to begin developing a mock-up, and working on programming some functionality.

Our first mockup

Wednesday-Thursday: Joanna and I continued developing the mockup and interface functionality. Joanna researched the Twitter API and experimented with mining tweets based on keywords, user names, and hash tags. I continued to work on the html mock-up, looking into flexible layouts and working on the functionality of DNA code translation in javascript.

Friday: In the morning, Joanna and I completed a little more work on our interface mock-up and created a paper prototype. For the remainder of the day we did more Twitter research and began to investigate animation in html5.

Week 5: June 24 - June 28

Monday: Today I spent some time playing with HTML5 canvas and created some simple test animations. The potential of HTML5 is both exciting and daunting. There seems to be support for really great dynamic interaction, but at the same time there are so many different frameworks, each with their own limitations.

Tuesday-Thursday: Throughout the week, I have been doing research and creating test files to experiment more with HTML5 canvas, playing with more animation and implementing some simple drag and drop functionality for the web application. Now that I have some simple test components working, the next step will be to integrate the test files with the html mock-up.

Friday: Inter-team bonding with BU at the Museum of Fine Arts.

Week 6: July 1 - July 5

Monday: In the afternoon we had our first full team stand-ups to see how each project team has progressed so far and discuss our future goals. Joanna and I spent some time in the morning preparing to present, listing our accomplishments so far, thinking about potential risks, and sketching out a timeline for project completion. It was great to see the progress everyone has made and how much we have all learned already.

Tuesday: Integrating the canvas elements with the rest of the application has been an obstacle. Ideally, we would like to drag elements out of the canvas into other elements of the application, but that doesn’t seem to be possible. I’ve been experimenting with various draggable elements, but they have to remain within the parameters of the canvas.

Wednesday: After battling with canvas, I’ve begun to experiment with using mouse coordinates to manipulate elements from the canvas.

Week 7: July 8 - July 12

Project Presentation

Monday: To access the elements drawn into the html canvas I created a mouse down event to compare the (x, y) coordinates of the mouse in the browser window with the coordinates of the canvas images. Rather than dragging elements out of the canvas, the event currently triggers the appearance of another image object outside of the canvas. This may not be the ideal solution in the long term, but at least it allows for some interactive functionality now.

Tuesday: Moving forward, I integrated the test applications into the project’s html code in Google App Engine. So now, in conjunction with Joanna’s hard work on twitter and GAE, we have a mostly functional application to test and build upon. It’s exciting to see everything coming together. In the afternoon we had a check-in with Orit, who seemed pleased with our progress. Following her guidance, we are going to begin to think about the look and feel of the application, developing a cohesive brand image, and streamlining the visual interface.

Wednesday-Thursday: We have been making steps towards getting the interface a little closer to our goal. Tweets are now accessible and showing up in the right place thanks to Joanna, which is a huge step. I made the canvas stretch across the entire application, and layered other components over it, so that we can potentially drag elements from one section of the application to another. We also found out that we are presenting to some of the other science departments on Friday, so Joanna and I spent some time preparing and organizing our presentation material.

Friday: Today Joanna and I presented our project to the other Wellesley CS/Math/Physics Summer Research groups. It was good to practice doing a formal presentation in front of our peers. I think it helped us to organize our thoughts about what we want to communicate and prepare us for future presentations.

Week 8: July 15 - July 19

Monday: After much pain and heartache, I finally managed to implement a better version of drag and drop on canvas, using event listeners and mouse coordinates. Now the functionality will allow for more dynamic movement and interaction, but will need to be revised. Hopefully this is on the right track, even though it feels a little bit like a step backwards.

Tuesday: In the afternoon the lab performed demos of our projects to a group of high school students. Presenting to a younger audience was an interesting mental shift. We had to make more of an effort to be engaging while also concisely communicating our ideas in understandable terms. The demo session was pretty quick, so we didn’t have a chance to observe much interaction and receive feedback, but it was good practice and the students seemed interested in our projects.

Joanna and I presenting our project

Wednesday: Natalie Kuldell from BioBuilder and Rebekah, a high school teacher came to visit the lab and see our project demos. Having input and feedback from them was really helpful and inspirational. Joanna and I continue to make progress improving the functionality. I managed to get HTML5 canvas to dynamically resize, so it is nice to have the possibility of a flexible layout again. The only drawback is that now some of the functionality needs to be revisited. At least Joanna had some success laying out the Codon Dictionary.

Thursday: Internet is down today, so it has been a little difficult to continue developing. Nonetheless, we now have a lot of other work to complete over the next week. We have to put together two new design mock-ups, and finish putting together a poster for the Science Center Summer Research poster session. Additionally, we need to begin thinking about writing research abstracts. So, we are going to take advantage of the technical challenge and begin working on our other quickly mounting tasks.

Week 9: July 22 - July 26

Monday: Moving forward with the design of the application, Joanna and I have begun to work on mock-ups of the final look and feel. We decided upon two different themes to elaborate upon, a minimalist-streamlined design and an industrial, steam-punk inspired design. For the functionality, we added a panel for the twitter feed of messages, using JQuery to fill the queue and to create a sliding panel.

Tuesday: In addition to working on the design mock-up, I spent some time today working on functionality improvements, and debugging some of the issues related to the canvas dynamic resizing.

New ticker shows backward translation

Wednesday: Another feature we added is a panel for the protocol, so that the user can follow the instructions to execute the tasks of the application. This is also a sliding panel that can be toggled open or closed.

Thursday: Today I began to work on revisiting the ticker. Using a canvas animation, the goal is to have the DNA codons scroll across the top of the screen and convert to English at a specified point. One of the challenges I have encountered is adjusting the speed of the animation, since three nucleotide bases correspond to one English letter. Additionally, I spend some time re-implementing functionality of the lab protocol on the new html canvas.

Friday: As the summer research program is drawing to a close, Joanna and I worked on laying out our poster, writing abstracts, and implementing the new design. I finished reprogramming the functionality of the application, only to discover a bug in the execution. The images are appearing on some machines, but not others. This is a frustrating end to a busy week, but we’re making progress and moving forward.

Week 10: July 29 - Aug 2

Monday: Spent the day debugging the functionality issue. It was a challenge and took a longer time than I had hoped, but it felt very satisfying to finally solve the problem, and it is a relief to be able to move forward.

Tuesday: Today I recreated the DNA synthesis animation, so that each letter of the codon translation is animated to show the process of translation from English to DNA code in greater detail. This also helped to improve synchronization of execution as the translation is occurring.

DNA animation

Wednesday: With one day left, I finished the DNA animation and continued to improve the functionality. Also, we will be performing user studies with the MIT-Wellesley Upward Bound students on Friday, so Joanna and I discussed the user-testing protocol and created a questionnaire from which to gather data. This helped us to think further about the research perspective of our project and gathering the appropriate data for analysis. We are particularly interested in better understanding the potential of our application to facilitate learning. In the afternoon, Joanna and I met with Orit to discuss our user- testing protocol, and received helpful feedback and advice.

Thursday: Summer Research Poster session

Friday: Today we executed three user-studies with groups of high-school students from the MIT-Wellesley Upward Bound program. We began the study with a pre-task questionnaire to gather information about the users’ existent knowledge of Synthetic Biology. We then gave a short presentation to introduce Synthetic Biology concepts, and performed a demo of our application. After the students had the opportunity to use the application, they filled out a post-task questionnaire with repeated questions about Synthetic Biology as well as an evaluation of the application itself.