Name: Tyler Degen

Type of Project: OhioSpeaks Website Redesign

1. Please provide a brief description of your STEP Signature Project. Write two or three sentences describing the main activities your STEP Signature Project entailed.

Over the Summer and into Autumn, I’ve been working with OhioSpeaks and developing the frontend of their website. This has involved streamlining their HTML markup, working with existing Javascript applications to make them more flexible, and developing a JavaScript recorder to replace the original flash-based recorder.

2. What about your understanding of yourself, your assumptions, or your view of the world changed/transformed while completing your STEP Signature Project? Write one or two paragraphs to describe the change or transformation that took place.

Before the STEP project, I had absolutely no idea where I wanted to end up. I knew I enjoyed (most) of my classes, but I wasn’t sure how the concepts would transfer from an academic setting to a professional.

I’d never worked on a professional website and expected this to be a quick learning project before returning to more traditional software development. However, the more I researched and taught myself, the more I came to love web development. It’s logically structured and linguistically nuanced, but also requires a lot of visual creativity.

I also thought it’d be okay to work on a solitary project, but I’ve come to learn that my work environment is almost as important to my happiness as my work itself. Working with Kathryn and Chris has been a fantastic experience, and I’m so lucky to be a part of their team.

3. What events, interactions, relationships, or activities during your STEP Signature Project led to the change/transformation that you discussed in #2, and how did those affect you? Write three or four paragraphs describing the key aspects of your experiences completing your STEP Signature Project that led to this change/transformation.

The first month of my project was just me bringing myself up to speed on HTML5 and CSS3 standards. My first main project was to update the structure of the main pages to meet said HTML5 standards and making sure it still looked approximately the same. This was an excellent first foray into web-development; I really had to understand why each style operated as it did. I eventually decided to take the text content and recode the structure from the bottom up instead of trying to recode it from the top-down, and, in this process, essentially learned how to build the static front-end of a website.

My next task was to fix the JavaScript tools that inevitably broke when I updated the mark-up. JavaScript is vital to making the webpage dynamic, and the one tool I’d broken with my restructuring was vital to the current OhioSpeaks model. It was called FancyBox, and essentially, when a user clicked on a thumbnail of an image of their spectrogram, it brought up a full screen image of their spectrogram, the word pronounced, and an audio file that they could listen to of the sound they produced. This extension also made use of JQuery, a popular JavaScript library that’s become quite ubiquitous in web development. Learning JavaScript and jQuery headfirst really put me in a good position for further professional work and has made me more competitive for future companies.

Afterwards, I wrote mock pages for new functions that Kathryn and I had developed. I knew what these functions had to do, but I’d never written in R, the language needed. Instead, I had to follow models already on the website and develop from there. Though I’m still not sure how to code from the base in R, the functions ended up working. Being able to work with bits and pieces you don’t quite understand at a basic level but that you can infer the purpose of is important for a programmer – occasionally you’ll need to contribute to a project in which you have no foundation, and I feel more confident in my ability to do so.

My most recent, and most rewarding, purpose for the website has been to replace a fragile flash plug-in (WAMI) with a more stable JavaScript based recorder. There are various examples on the web, but none of them did quite what we needed. We needed something that would begin recording after the user had authorized the microphone, end recording after a certain interval of time, and push the recorded mp3 to the server with a certain naming convention. Though Chris and Kathryn often gave me pointers, this aspect of the project was largely mine. I’m excited to say that the project has been quite successful – the tool on its own does exactly what it’s supposed to, and Chris and I are working now to implement it with the rest of the website.

4. Why is this change/transformation significant or valuable for your life? Write one or two paragraphs discussing why this change or development matters and/or relates to your academic, personal, and/or professional goals and future plans.

Before this project, I felt overwhelmed and uncertain regarding my future. I knew of my academic interests, but I didn’t know how to translate those to a professional setting.

But rather than develop in areas I was comfortable in, this project pushed me into work I had no experience in, work I was completely unfamiliar with. And I loved it! It taught me how to collaborate on a server-based project, and how to succintly explain myself to co-workers at a distance — though we only met in person once a week, we kept in touch nearly daily through Slack. I learned to handle foreign concepts without being stifled by fears of inadequacy, because, at worst, help is only as far away as asking for it.

Above all, I’ve gained confidence in my abilities, and I’ve realized that pursuing what’s important to me and what fascinates me over what seems safe and set will ultimately lead to a more satisfying and fulfilling experience.