Codelicious is an education technology startup that was founded in 2015 with the ambition to help empower teachers in the effort to provide quality STEM education. During my time at Codelicious, I played an integral role in many different teams. From developing and managing the curriculum courses that we offer, to developing and managing the roadmap, strategy, and design of an exciting new application that would change the game in how STEM curriculum is delivered.
Codelicious has been a big part of my professional and personal life. They have given me the opportunity to practice a lot of the skills that I am looking forward to using in industry such as leading, product management, and web development. I bumped into them senior year of high school and found their purpose impactful: building confidence in educators and students confidence by providing instant access to computer science curriculum for grades K-12 that any educator could teach. I reached out to them and was able to join the team pursing this mission of access and empowerment to STEM curriculum. Since the beginning, I have taken many roles and responsibilities that have given me the opportunity to build a better understanding of what I enjoy doing, provide good for the future of the community, and to build valuable connections with those in the technology industry.
I have experienced many roles throughout my time at Codelicious due to the evolution of the company. From starting off working in a one room office where we shared a table, to getting a coworking space, to having a floor in a bigger building, I have experienced growing along side the company.
June 02, 2021 - September 15, 2022 | Interaction Designer
Summary:
▪️Utilized DesignOps methodologies to build out what design at Codelicious looks like
▪️Managed a design system that developers can navigate and understand
▪️Wrote application feature stories for developers to successfully build elements of a patented application that cut product delivery time down by 50%
▪️Investigated and documented user’s tasks, developed interaction pathways for each task and created journey maps based on those pathways
▪️Organized and conducted user testing sessions to gather information to validate and improve the design work
▪️Worked with cross-departmental stakeholders to identify challenges with internal processes and how it affects their goals
▪️Created wireframes, prototypes, and other interaction design deliverables for application screens
▪️Utilized web development tools (JavaScript) and GitHub to contribute with Codelicious Curriculum Patent
▪️Communicated with leadership on project status and roadblocks
The goal during my time as a full time Interaction Designer was to speed up the product delivery process. This solution would only be used for Codelicious' product delivery process.
Understanding how the product delivery process worked was the foundation to building this new piece of technology. To get a clearer picture of how the delivery process worked, I conducted many contextual inquiries. This helped me create a timeline of the events taken to get the product out the door. Having this step-by-step snapshot also provided a lens into seeing what areas of the process needed improvement and how each step of the process could be enhanced through technology.
Due to the fact that we had a really early MVP of this application, I also found it beneficial to understand how this was build and find areas that could be improved to better facilitate the new delivery process and goal that the application was trying to achieve. Doing usability tests and heuristic analyses revealed that the previous application was not fit to handle the path that the delivery upkeep.
All of the heuristics had plenty of violations. These violations were recorded and recommendations were given to help approach a solution to fix these violations later.
The primary users of this application were the employees of Codelicious. More specifically, those involved in the delivery process. To distill more pain-points from their current experience going through the application process, I created some personas to reference as features were developed and testing sessions were planned.
To move forward, I had to determine how to break apart the process into different Epics (set of features under similar "theme") that would be easier to manage and approach. With the given full vision of the application, different phases (goals of the application) were also planned out.
After understanding the delivery process and the breakdown of the different phases, I decided to create a potential site map for the up-and-coming application. This helped me digest the different areas that would be needed to make the app functional and have the ability to be navigated through.
There were many iterations of the designs as they were evaluated. All higher fidelity designs were made on Figma.
Building and maintaining the design system for Codelicious is something that I am particularly proud of. To get to the design system that we had, I had to do a lot of research into DesignOps and how to build a usable and scalable design system. The goal was to not just have this design system be accessed by me, but also be accessed by the developer team. To make it easier for devs to understand and use the design system, I made sure to include design tokens and followed the component rules set by Material UI since that is what we were using to build the app.
The final designs shown below had to be highly edited to be able to present them here due to NDA. The structure/skeleton of the application was kept, but all information that had to do with the app and branding was removed. Not much information about how it is used and not all of the assets can be shown.
Lots of evaluation was done with users and developers throughout the buildout of the application. Much of the actual research protocols and results cannot be shown. Before each evaluation session, I would create a research protocol that was written out with goals and procedures. When the evaluation was finished and analyzed, the results would be presented in a Google Slides format. All of my research was placed in a research repository where I labeled different topics, findings, and how it related to different areas of the app.
Keeping the rollout of features required me to develop a clear and agile process. My design process looked like:
This is where we start to bring the idea to life to show others on the team.
Work at this stage has been picked up, however it is still in initial exploration. Research materials are gathered.
This is where we review work with users and other stakeholders. We get feedback from developers and managers here.
Research is throughly investigated. Research protocols are created here.
This is the to-do list. It is full of ideas and suggestions that need some design love. This is also a place for just any ideas that come to mind.
To keep track of what was changed or created, recapping and documenting the journey is what helps keep everyone in the loop. Here is where we make sure the necessary information and narrative is recorded.
Being in this state shows that the design is ready to marked as finished. Edits in this stage should be avoided.
If the work needs to be brought up with marketing, then this would be the step to do so.
A piece of work only gets moved into speccing if it has been proven to move in the best possible direction. This shows that the work has been reviewed.
Being in this stage signifies that the work can be passed down to developers to be created. Here is where a feature ticket needs to be created will all necessary information for devs to successfully create the feature.
I was able to completely go through the first phase of the initial goal during my time. Seeing the potential and success of the piece of technology, the next phase of the application began development. I took part in planning the roadmap for the next phase and had the opportunity to start on building that process. This next phase included new features and improvements to existing version.
June 2020 - August 2020 | Product Development
Mapped out an additional 30 hours of content for the most popular product that we offer. This addition gave schools a full years worth of curriculum to teach.
May 2019 - May 2020 | Product Development
This summer was a special one because we started to get some full time staff that would launch Codelicious into its next chapter. I worked very closely with the new product manager of the team to build out a patented application that would serve as the company's course creation tool, means of getting courses bundled up and delivered to customers, and a database for all of the curriculum that we offer. I used web development tools such as React, and NodeJS to build the application along with GitHub to be able to successfully collaborate with my product manager. Throughout the development and ideation of the app, I used a Kanban ticket system to keep track of progress. Mid fidelity prototypes were built with Figma. User jounery mapping and usability acceptance testing were used to help create and improve the app along the way as well.This summer I was also able to visit multiple tech companies downtown Indianapolis to get a better understanding of different work cultures in startups and bigger corporate companies.
May 2018 - April 2019 | Curriculum Specialist
This summer I organized and created coding curriculum with the help of two assigned interns. The coding curriculum that I was in charge of was the web development and photoshop courses. The web development course included a semesters worth of HTML, CSS, and JS. The Photoshop course was a basic introduction to Photoshop. Both included instruction on the activities that would need to to taught and done along with projects that the students would be able to do.
June 2017 - May 2018 | QA
To start off my journey with Codelicious, I took the role of a general employee/intern. At the time, Codelicious had just about two years of creation and was starting to gain some clients to provide more curriculum to. My primary tasks that summer were to provide classroom support when going to teach lessons at different camps and assist in operational and curriculum development tasks. Assisting in curriculum development tasks included reading over coding curriculum for errors and flow.
