Bao Web Development

Iris: A Note Taking & Sharing Application

While there are many note taking and sharing applications, many try to be a Swiss army knife by integrating features such as professor ranking, grades tracking, and course reviews, to name a few. While these features are useful, it contributes to the bloat and learning curve of an application. In the spirit of Google Docs, my team and I set out to see if we could create a more streamlined and intuitve note taking and sharing application for our Software Construction and User Interfaces (Com S 319) course.

System Design Considerations

To effectively take, organize, and share notes, a text editor, a labeling system, and a search system is needed. In addition, an authentication system is required to associate notes to users so that they can organize notes that have been created by or shared with them. To streamline the note taking and sharing workflow the application made use of navigation tabs and a calendar widget. To operate, the systems pass around data model objects representing labels, notes, and tabs. These data model objects encapsulate data of one instance of an entity along with that entity's associations with other entities. To store the data and associations a database management system will be utilized.

To develop an application within the time constraints of a semester of class we relied on the ASP.NET and Windows Azure development stack. Additionally, we used open source tools such as jQuery to implement the client-side controls and tinyMCE as the rich text editor component. To reduce complexity, enhance security, and maximized interoperability we adopted the MVC design pattern and followed industry best pratices as outlined by the W3C et. al.

Concluding Thoughts

Proper planning and use of development tools made implementing the application a breeze, but it was the nuances of the open source libraries that presented the biggest risk to the project. It took creativity to adapt the design to leverage the systems present in the ASP.NET framework. It took even more hacking to get the tinyMCE editor function properly within our unique use cases. This required creative use of CSS and JavaScript to implement properly across all major browsers. This project was a great opportunity to flex the power of CSS, AJAX, and MVC to tackle a complex Web 2.0 application.

Complete specifications of the system can be viewed here.