Tufts Maker Network

Built on the momentum of Tufts MAKE and a growing culture of making at Tufts, my Master's project to create a web-based platform for maker communities at maker.tufts.edu was one of the most technically challenging endeavors of my early career.

Using everything I learned as a budding Human Factors professional and freelance web designer, I built the site from the ground up to integrate with other makerspace technologies and enable students to easily create project portfolios using an inline editing interface.

Eventually I can see the Maker Network becoming part of a "Maker Toolkit" to support makerspaces and new maker communities in K-12 schools and elsewhere. Until then, the lessons I've learned through building it have greatly influenced the direction of my next project; Acorn.

Background

In early 2014 Professor Brian Gravel from Tufts University's Center for Engineering Education and Outreach (CEEO) contacted me to discuss Tufts MAKE's activities over coffee. The CEEO was interested in researching and developing makerspaces in K-12 schools, and they invited us to help with a small-scale pilot space they would be setting up in Tufts' Tisch Library over the summer called "Jumbo's Maker Studio".

I readily accepted their invitation and offered to use my website-making experience to create a marketing-oriented website for their pilot. Expanding the opportunities to learn by making was always one of Tufts MAKE's goals, so working with the CEEO to establish a makerspace at Tufts was a natural fit.

I worked with the graduate students conducting the pilot to create a basic list of requirements for the new site:

  • Hours of operation
  • Upcoming classes/workshops
  • Staff listing and contact information
  • Equipment documentation
  • Project case studies

After a few weeks of development I launched the new WordPress-based site on August 1st, 2014 at a subdomain of tuftsmake.com (which I owned). Eventually it became maker.tufts.edu when the CEEO decided to move the Maker Studio into their new office at 574 Boston Ave and make it available to the entire Tufts community.

Recognizing the potential of the Maker Studio and its website to shift Tufts' maker culture and enable more projects like the Oreo De-Creamer, I continued to update the site while running Tufts MAKE and held workshops in the Studio whenever possible.

The Maker Studio homepage in late 2014

Challenges

As Jumbo's Maker Studio expanded so did my aspirations for what the website could eventually become. As I continued to build and improve the site through 2014 and into 2015, it gradually became clear that the entire WordPress-based site needed to be rethought and rebuilt to address a few key problems.

Extensibility

Shortly after the summer pilot ended other graduate students at the CEEO began to develop new technologies to support makerspaces in K-12 schools. One Ph.D. student was developing a keycard-based system that could prevent untrained students from turning on certain equipment, and another Master's student was building a "documentation station" that could capture photos and videos of students' prototypes.

Integrating these new technologies with the website seemed like the natural thing to do, along with a myriad of other features that we thought the site should be capable of:

  • Student features
    • Profile pages
    • Project pages
    • Course pages
  • Makerspace management features
    • Tool documentation
    • Room and equipment reservations
    • RFID integration / equipment access restriction
    • Supply purchasing
    • Web-connected 3D print monitoring
  • Community features
    • Weekly newsletter
    • Shared event calendar
    • Project idea board
    • Club pages

Unfortunately the site was already beginning to exhibit the same performance issues that plagued TinkerTry and I worried that adding even more WordPress plugins would make it unusable. I was also concerned that future webmasters would struggle to keep the site and its many plugins updated and secured, turning it into a broken mess that would have to be taken down.

Usability

The many steps required to change a user's profile photo using WordPress.

During the Maker Studio's pilot I noticed that students were finding it prohibitively difficult to create user profiles and edit content using WordPress' backend interface. Changing their profile photo was a precise multi-step process rather than the 2-step process they were used to on Facebook, Twitter, and Instagram.

Seeing college students struggle to use WordPress' administrative interface to make simple changes made it clear that the new site would need to let students manipulate content directly within the page itself.

Longevity

As Tufts MAKE began to collaborate with other making-oriented groups at Tufts like the Crafts Center, Robotics Club, and Entrepreneurial Leadership Society, I started to consider how the site could address some of the "barriers to making" that I experienced first-hand through Tufts MAKE. I met with leaders and students of each group to discuss their challenges, and identified two primary barriers that affected us all:

Some of the barriers that Tufts students encounter when trying to prototype and grow their ideas.

  1. "Activation Energy Barrier"
    • Finding the right equipment
    • Learning new skills, or finding others with those skills
    • Purchasing materials
    • Documenting the process
    • Time to figure things out
  2. "Growth Barrier"
    • More time to figure things out
    • Finding a team
    • Finding funding

Plenty of entrepreneurial groups and resources existed at Tufts to help students get past the second barrier, but the first barrier was often insurmountable to the average student.

I started to wonder whether the website could somehow lower that barrier by becoming the central hub for a school-wide "Maker Network" of sorts that connected all of our making-related clubs, spaces, courses, and resources. Students could find and get trained on every piece of equipment in our spaces, meet other students with similar interests through our clubs, document and publish their portfolio-worthy coursework, and potentially even get funding to build prototypes or start new ventures.

By becoming a foundational "rock" for everything making-related at Tufts, the Maker Network seemingly had a chance at becoming a long-term endeavor that could outlast the cyclical 4-year nature of student-run groups.

As lofty as this idea seemed, I was ready to build something that would last. My efforts with Tufts MAKE and my proposal for the Maker Network earned me a full graduate scholarship, and I joined the CEEO to start building it.

Objectives

My many conversations with Tufts students, club leaders, graduate students, and CEEO staff members informed the primary objectives of the new Maker Network website:

  1. Make editing pages easy and simple through direct manipulation of content
  2. Allow sub-communities to privately share work, assignments, and ideas
  3. Collect and organize all of Tufts' making-related information and resources
  4. Integrate with other in-space technologies to facilitate student documentation and makerspace safety

After successfully converting TinkerTry from WordPress to Kirby CMS in early 2015, I started to think that a home-grown platform built on top of Kirby would be the best way to meet these new objectives while addressing the original site's challenges.

Prototyping

During the summer of 2015 I worked at the CEEO rebuilding the entire site from the ground up using Kirby while testing basic prototypes with high school and college students. I integrated a JavaScript-based editor called ContentTools and implemented a saving mechanism to test out in-page editing. The resulting user experience was a leap ahead of what we could create with WordPress at the time.

One of my first tests of in-page editing.

Throughout 2015 and 2016 I continued to add more functionality to the site like user account handling, page visibility settings, media uploading, and integration with the CEEO's other makerspace technologies. Creating everything from scratch took longer than installing a bunch of WordPress plugins, but the result was a far more flexible, stable, and capable platform that enabled us to quickly prototype almost anything.

Two engineering courses used the new Maker Network website to document their projects, and I demonstrated the platform to other departments at Tufts and professors from MIT and Harvard University.

A few of my sketches for various iterations of student portfolios, project pages, and the editing UI.

Key features

An overview of the site demonstrating inline editing, private pages, theme colors, and more

Inline editing

The Maker Network offers a familiar editing experience to users of Facebook, Twitter, Instagram, Tumblr, or newer platforms like Medium. Instead of jumping between a "frontend" and a "backend" to edit content like WordPress requires, clicking an omnipresent "Edit" button makes everything in the page editable. Editing content feels like directly manipulating the website itself.

Other tasks like reordering the navigation bar, changing user permissions, adding page authors, or tweaking a page's theme color is also done directly within the site itself without any additional layers of abstraction.

Space, club, and course pages

The platform also offers a few different page types and widgets to support spaces, clubs, and courses. Spaces with physical addresses can display their hours, staff, and a map of their location within the page's sidebar. Clubs can display all of their associated projects, members, and external resources within their own dedicated page. Courses can post assignments and privately collect project documentation from students.

Hardware integration

Every account on the Maker Network website is also shared with the CEEO's RFID-based Usage Tracking system to restrict student access to equipment based on their training. The site can also receive and automatically post photos and videos taken with in-space cameras to the associated student's public profile in an Instagram-like way.

Because the Maker Network is a web-based application with very few dependencies, it can also be installed on a local device like a Raspberry Pi and used by a classroom of students without an internet connection.

Student portfolios

Similar to Facebook or Twitter, every user is given their own profile page to collect all of their project documentation and coursework. As students complete more projects these portfolios could be publicly shared with potential employers or privately shared with parents of K-12 students.

Web-based and indexable

Because the Maker Network is a speedy and well-structured website instead of an app, search engines are better able to crawl its pages to help visitors find the information they're looking for. Tufts' Maker Network consistently appears in the top results for almost any search term related to making things at Tufts, helping students and faculty discover the resources that Tufts' spaces have to offer.

Being built with web technologies also lowers the technical barrier to entry for contributers who would like to improve the platform or tweak it for their schools. All of the Maker Network's code is open-source and available on GitHub.

Future

The Maker Network still exists today and delivers roughly 2,000 pages to 600 unique visitors per month. It never became the “rock” for Tufts’ maker community that I hoped it would be, primarily due to time constraints, but it continues to be a useful resource for prospective students and researchers seeking to learn more about Tufts’ spaces and maker culture. I still regularly get emails from people around the world who are interested in visiting and learning more about how our spaces got started.

I plan to continue hosting the site at tufts.makernetwork.org for the forseeable future until either Tufts' IT department or another ambitious individual picks up where I left off. I can imagine the Maker Network and the CEEO's other technologies being bundled into a “digital makerspace in a box” that could greatly assist other schools, and I hope that happens someday.

After graduating from Tufts in 2017 with a Master's degree in Human Factors, I started to think that the underlying technology of the Maker Network and its approach toward content management could be applied to solve other problems. Blogs like TinkerTry, eCommerce sites like those of my clients, or even discussion forums and ticketing systems could benefit from the speed, extensibility, usability, and stability that the Maker Network's core could provide. That train of thought eventually led to the creation of Acorn; my own take on a website content management system.

Conclusion

A poster I created summarizing the Maker Network's development

Creating the Maker Network was by far the biggest technical achievement of my young career, and a surprising conclusion to a 5-year journey that began by de-creaming an Oreo.

I consider the Maker Network to be my personal "thank you and farewell" to the team that helped me start Tufts MAKE, the many graduate students and club leaders I worked alongside, the advisors who encouraged my wild aspirations, and Tufts University as a whole. I leave it behind as an imperfect but storied gift, and the culmination of all of my personal and academic growth during my time at Tufts.