Overview. In order to encourage interdisciplinary education in both the arts and the sciences, Cornell iGEM has implemented software to create both a mobile application and a video game. Our MicroMurals mobile application serves the purpose of connecting science and art through an interactive, accessible, and user-friendly interface. On this app, users can scroll through a feed of 3D printed designs, watch a live stream of the printing, submit their own designs for printing, and have a home page on which they can see their submissions. The app will also contain a queue for users to see when their printing begins and an estimated total printing time. We’ve also created a video game to help students and other users understand the engineering process behind a MicroMural. By making an online game, it makes it completely free for students to play with! It is a fun, engaging way for users of all ages to learn more about our project. MicroMurals Mission is a prime educational tool because it combines learning and entertainment, allowing students and all users to have fun and build positive associations with science. In fact, using this “Choose your Adventure” style game in pedagogy will allow users to build on both cognitive and non-cognitive skills like decision-making, discipline, patience, and nurturing curiosity. However, one of the most important facets of MicroMurals Mission is that it encourages users to engage with the scientific method in a fun way as they walk through the trial and error engineering process of making microbial art while being guided by our own MicroMurals mascot! Mobile Application: Key Features. Live Stream: One of the features of the app will be to share a livestream of the printer at work with all users. There will be a live stream set up 24/7 streaming the ongoing printing processes of all the user submitted and team created print designs. The stream is hosted through a YouTube live stream, on the Cornell iGEM YouTube channel. By accessing the livestream through the app, users can view any current 3D printing projects and even watch as their own designs are being created. The live stream is currently up and running through YouTube, and we aim to have the feature enabled in the app shortly. Image to STL: A key feature of the app will be allowing users to submit their own designs to be 3D printed. The app would feature an image submission tool where users can submit a .png or .jpg file to the app, which can then be converted to a .stl type format which is compatible with the 3D printer. A user can choose to submit any number of designs, and the final candidates are then chosen by the team and created using the outline steps from above. The exact process of image submissions is as follows: The user submits an image in the app The submitted image is uploaded to a shared team folder from the app The uploaded images are then manually run through an online image to stl file converter by a member of the team through this link The resulting .stl is sliced using Cura to prepare the file for printing The final design in printed on the 3D bioprinter As an example of what the image to .stl converters are capable of and how it can affect the printing resolution of the original image, we have included three images below. In Figure 1, one can see that we sent the Cornell iGEM logo as our original image into an image to .stl converter. We used the following two converters: https://imagetostl.com/ and https://www.3dforprint.com/. One can see that the original resolution depleted through the conversion process, however, the variation of depletion depends on the converter used. In Figure 3, we used the 3dforprint website and found that the resolution and overall file is of higher quality than in Figure 2, in which we used the ImagetoSTL website. All in all, the printing resolution is dependent on the image to .stl converter which greatly affects how the final 3D print will look. Through further testing, our team can determine the best converter that produces .stl files that are most compatible with good printing using our 3D bioprinter. Process/Timeline. Week 1: We had our first sprint where we designed the mockups for the screens on Figma and set up the React Native environment for developing the app. Week 2: We did user testing on the mockups, collected feedback, and improved upon our designs. Week 3: We had our second sprint in our agile development cycle where we actually developed the frontend using React Native. We also implemented some basic backend functionality to store the clients’ data. Week 4: We made our final improvements on the app and released the app to production. Design. We opted to have a fairly minimalistic design so that it would be easy for users to use and navigate. We also aimed to be consistent with our color schemes and had the same ones for the login and sign-up page, and the attachment and live feed and gallery page. Furthermore, we kept three buttons at the bottom to switch between screens for a more intuitive design. We also made the introduction screen the same color scheme as our website since our users said that it would be confusing if we had contrasting color schemes between the two platforms (see “User Testing” section for more information about the user feedback we incorporated). Below are our designs of the different screens on our mobile application. Development. To implement our software, we used React Native to create our mobile application. We chose React Native for two main reasons. First, it allows us to be more organized since it is very modular and it is easy to reuse code in React. Second, React is great for mobile development and is much faster compared to other frameworks when developing apps. As a cross-platform framework, React Native allowed us to create a mobile application that could reach a broader audience. User Testing. For the initial user testing, we sent out an anonymous survey to students at Cornell University and other universities that questioned them on the design of our app. Within this survey, we learned from users about their thoughts on the visuals, layout, and usefulness of pages on the app. We also asked users to rank the clarity and straightforwardness of the design and layout. The results from this survey are as follows: majority of people described our designs as aesthetic and trendy, and majority of people ranked the straightforwardness and clearness of the designs a 5 out of 5. Some of the constructive feedback we received was “I like the design a lot however there are design differences among the different screens. Maybe improve consistency of layout, color, etc.” as well as “Very straightforward and simple to navigate. Just make sure about color accessibility issues and making fonts/styles more modern looking would be very nice”. Using the feedback provided from this survey, we hope to incorporate a more accessible color scheme and ensure that the font colors/sizes are improved for readability. Next Steps. Finish connecting the frontend to the backend securely so that the data inputted by the user can be stored in a database server ideally hosted in the cloud. Developing the image to stl process to fully automate the process, and integrating image to stl conversion on the app such that an image can be submitted and be ready for printing without intermediate human processing.