UX Designer / Web Developer / Communicator / Educator

My love for forming and connecting communities energizes my work in the construction of digital spaces and educational curricula.


This work displays how I engage with clients and communities to create well-defined, results-oriented products, whether it’s a website designed to promote e-commerce, a social media strategy for a nonprofit, or a unit plan for a novel.

UX Design / Web Development




As a web developer and UX designer, I use a strict design and development process, as well as frequent collaboration with clients, to ensure that the final product reflects the branding/ethos of the client and fulfills the client’s digital communication needs.

Humans Uniting for an Equal Society (HUES) Website

HUES Website


As a freelance web developer, I am currently working with Humans Uniting for an Equal Society, a small nonprofit in Lansing, MI, to create their organization's website. This website's purpose is to lend the organization further credibility with the community and to inform users about facets of the organization, such as who the board members are and what happened at current/past events and meetings. The project is currently in the coding and development segment of the process.

Strategy & Scope Research / Architecture Diagram

Before engaging with the research necessary to begin this project, I met briefly with the HUES Board to discuss the how the website needs to be aimed at creating a well-rounded image of HUES, communicating the mission of HUES, developing credibility within the community, and recruiting new members. I also created a project plan to keep me on a designated track throughout the design and development process.

In order to determine how best to implement this strategy, I collaborated with the Board to determine the scope of the information that the organization needs to communicate through the website, and how the website can be divided into pages to accomplish these needs. I also researched the websites of local nonprofits, analyzing how they organize their information, what kind of information they contain, and how to improve on their construction. After determining the struture of the website, I used Slickplan to construct a architecture diagram for the HUES website. The architecture diagram can be found below.

Content List

Before designing the website, I worked closely with the Board to create a list of the content needed for each of the website’s pages, as well as the size or length of each of the content elements. During this process, in addition to the creation of content, typography was chosen for the text, as well as color and textures for the backgrounds and containers. This was done to expedite as much as possible the process of creating the design prototypes so that the final images and text could be quickly acquired and used for the prototypes. The content list for the "Home" page can be found below.

Lo-Fi Sketches

After undersanding the structure of the website itself, I shifted towards designing the skeleton of the various pages. As a result, I drew out the initial sketches so I could show the Board a quick sketch of what these web pages would look like and how they could display navigational elements, images, and text content in a structured, organized layout. I also created these in order to determine what the navigational structure, information structure, and interaction structure of the page would roughly look like. Examples of lo-fi sketches for this website can be found below.

Lo-Fi Wireframes (Axure)

I used Axure RP to produce digitized wireframes of the website’s pages. The purpose of these wireframes was to illustrate for the Board the layout of the website, showing the exact dimensions of the website’s content containers, images, and text containers. These were also created for the purpose of illustrating how navigation operates between pages, as well as the function of some of the website's interactive elements. Examples of the lo-fi wireframes for the landing page and "About Us" page can be found below.

Hi-Fi Design Prototypes

The purpose of these design prototypes was to implement the content, typography, and color/textures into the website, providing visual prototypes that aimed to mimic the final visual layout of the website. These were then submitted to the Board for approval. During this submission process, I engaged the Board in dialogue in order to gather feedback that would then be realized in the coding and development process. After approving the prototypes with the Board, I conducted simple user tests, analyzing how users perform some of the key experiences on the website and whether the design needs to be revisited in order to improve those key experiences. Examples of the design prototypes for the landing page and "About Us" page can be found below.

Coding and Development

This website was coded using Bootstrap as a CSS Framework in order to utilize a mobile-first approach. Screen breaks were only created for a desktop version and a mobile version. The tablet version of the website is essentially the same as the desktop version. Instead of creating sub-pages for sections just as individual board members or individual events, I used JQuery as a means to keep all of the content on one page, creating clickable trigger events to show and hide certain containers on the page. This simplified the website by eliminating excess HTML pages, speeding up navigation to those sub-sections. After the website was finished, some user testing was conducted to scan for major usability issues, after which fixes were issued to the most pressing issues.

My current post-launch role is to update the website when new content is given to me, and to suggest changes and updates that could be implemented to enhance the user experience and meet the goals of the organization.

A link to the website can be found below.

Project Armory Website

Project Armory Website


As a freelance web developer, I am currently creating the website for one of my clients, Project Armory, a new business out of Mason, Michigan. I frequently meet with Project Armory’s Team Lead to determine how to refine the design of the website and its content, as well as how the website can best fit the needs of a company based around e-commerce, information dispersal, and community creation. The project is currently in the development process.

Strategy & Scope Research / Architecture Diagram

After a couple initial meetings with the entire team, where we discussed the purpose of the website and how far the scope of the project should stretch, I conducted research on the websites of local businesses in the area, especially businesses that sell the same kind of product as Project Armory. This research also worked as a competitive analysis, showing Project Armory what local businesses they would be competing with and the features that their digital spaces offer to users. After examining the ways that these websites funnel users toward their products, I had a dialogue with Project Armory about the features that should be included on their website. After coming to a consensus, I created a architecture diagram to define the structure of the website. The architecture diagram can be found below.

Content List

Before designing the website, I provided the Team Lead with a list of content that I needed in order to create design prototypes for the entire website. We divided up the content so that the Team Lead could create the content that he specifically wanted to handle and I could create the content that I was tasked with writing. After the content was created, I worked to edit it to the point that it was finalized and cleared for use on design prototypes for the entire website.

Lo-Fi Sketches

After creating the structure of the website and defining what content is needed, I looked to design the skeleton of the various pages. I quickly drafted sketches of the proposed layout of the website pages in order to clear the initial design with the Team Lead, discussing the layout of navigational items, images, and text content before moving onto digital prototyping. An example of a lo-fi sketch can be found below.

Lo-Fi Wireframes (Axure)

I used Axure RP to produce digitized wireframes of the website’s pages. These digital wireframes were designed to show the Team Lead a more defined layout for the website, providing exact dimensions for images and content containers. I also wanted to illustrate how the components of the website interacted with one another, as well as how the navigation system operated. After another meting with the Team Lead, these layouts were edited so they could be utilized in the initial phase of the design prototypes.

Hi-Fi Design Prototypes

After being provided a color palette for the website, I created four different design prototypes for a single page, using various combinations of the colors provided, as well as different fonts that I had chosen for the typography. I later met with the Team Lead and a portion of the team to discuss the merits of each of the prototypes and decide on a specific color scheme to use consistently throughout the website. These prototypes were used in simple user testing to determine differences in usability and user experience between designs.

Email Landing Page

While the website goes through the development process, I created an email landing page that acts as a temporary home page. I used Instapage as a front-end content creator to design the page, and I deployed it using a Wordpress plugin. I also linked the email sign-up sheet to Project Armory's Mailchimp account; I discussed ideas for email campaigns with them as a way to create buzz and excitement around the impending website launch.

Coding and Development

I constructed the website using Wordpress and used the free version of Optimizer theme to gain a great deal of control over the layout and the style of the website. I also used Optimizer so that, as the company grew, they would have the capability of upgrading Optimizer to gain further control over customization without having to switch themes entirely. I still used some custom CSS to stylize some components of the website for the sake of consistency. I also used the Page Builder plugin to utilize a grid system as I created some of the pages, and I used an Image Caption Hover plugin alongside Page Builder to make the backbone for the Gallery page. Lastly, I installed WooCommerce so that Project Armory can begin the transition from selling products on Etsy to selling products on their website.

At this point, since the architecture of the website and the structure of the pages are in place, the Team Lead wanted to take over creating and placing content, using me in a support role, where I advise how content is used and how to best update the website. As such, the construction of the website is now being driven by the team at Project Armory, though I am still working in this support role.

A link to the website can be found below.

LAHR Usability Testing

LAHR Usability Testing


The Lansing Association for Human Rights (LAHR) wanted me to conduct some preliminary usability testing and auditing of their website. This was done for the purpose of assessing the current state of the website, as well as what to emphasize in the case of a redesign or update.

Research and Personas

First, I identified the various user groups that the LAHR website aims to attract and created personas to better realize the individuals in those groups. As I created the personas, I researched how the users in those groups operated and brainstormed potential motivations, goals, and frustrations they might have. These personas helped me identify what the potential uses for the website would be, as well as what how the various testers would want from the website. The personas can be found below.

Website Core Functions

With these user groups and their motivations in mind, I next brainstormed the various functions that the website should be capable of in order to both service the user groups and the needs of LAHR. I recorded those functions and then tested the website to see what functions it is actually capable of. This was done to figure out what functions I should emphasize in the usability testing. This way, I can pinpoint the most pressing usability issues on the website. The list of core functions can be found below.

Cursory Expert Evaluation/Audit

I next worked through an evaluation of the website's pages, testing exactly how capable the website is of performing its key functions and finding major usability issues in the process. I went through every page and tested every link and video to see what works correctly and what is not functioning properly. I also looked through the informative content to see what is outdated, what is incorrect, and what serves its purpose correctly. Lastly, I analyzed my findings for major usability issues, making a list of most pressing issues to consider. The evaluation/audit can be found below.

Usability Script/Tasks

Using the information I gathered from my audit and from my list of functions, I created a script to use for usability test sessions and a list of tasks for testers to perform. The script was adapted from Krug's script in "Rocket Surgery Made Easy", with questions modified to match the broad scope that the LAHR usability testing had. The tasks were created by looking at the list of functions available on the website and the list of functions that were most pressing to test. Once I had these documents complete, I found 3 testers that met the criteria set for me in the personas and conducted the testing. The script and set of tasks can be found below.

Usability Testing

I conducted the usability test on 3 participants, working through the script and the task list, taking notes on the processes that were used and the rationale behind those processes. I asked follow-up questions when necessary to further analyze why a certain task was frustrating, easy, or confusing. The test notes for one test session can be found below.


Using all of the information that I compiled, I created a short list of usability issues to emphasize, along with components of the website that were particularly usable. This was prepared as a short memo to ensure that it is as easy to navigate as possible. I presented this to LAHR and discussed the rationale behind the points on the memo. The findings document can be found below.


As a communicator, I help organizations best utilize digital spaces and physical media to create connections and community with audiences they are attempting to reach.

"The Come Out" Event Promotion

"The Come Out" Event Promotion


As the Communications Strategist for Humans Uniting for an Equal Society (HUES), I was responsible for the event marketing, advertising, and planning. On January 22nd, 2016, HUES hosted “The Come Out” at The Avenue Café in Lansing, MI, and we managed to attract over 200 people to the event, completely filling out the venue. It was our first high-profile event and it went phenomenally, allowing HUES to not only connect with local politicians and local media, but also with local human rights organizations both on MSU campus and in the Lansing area. I spearheaded the marketing, planning, and organizing efforts for “The Come Out”, creating an effective strategy that operated on multiple fronts.

Digital Media Promotion

After setting up the event on Facebook, I made periodic posts about the event and reposted articles that were either related to the content of the event or about self-care. The purpose of these Facebook posts were to continually promote activity surrounding the event and to bring more people to the event page and the HUES Facebook page. In addition, I reached out to local human rights organizations such as MSU’s The Alliance of Queer and Ally Students, Suits in the City, and Gateway in order to spread awareness of the event and to build relationships for the purpose of event collaboration in the future. Examples of social media posts, as well as a link to the event page, can be found below.

Physical Media Promotion

I assisted in the creation of a flyer for the event and worked to coordinate distribution of this flyer throughout businesses in the mid-Michigan area. I created a map that split mid-Michigan into geographic sections and delegated members of the HUES Board with distributing flyers in these designated sections. This coordination worked to maximize the efficiency of flyer distribution throughout the mid-Michigan area. I also met with MSU professors and asked them to distribute these flyers digitally, spreading them to other MSU campus organizations, mostly groups of graduate and PhD students that HUES did not have direct connections with. The flyer, along with the flyer distribution map, can be found below.

Local Press Promotion

I also contacted many local media outlets to promote the event in local papers. I contacted the Lansing State Journal, the State News, and the City Pulse, providing them with a press release document, inviting them to conduct interviews with us about the event, and inviting them to the event itself. Examples of news articles referencing “The Come Out” can be found below.

Event Booklet

I created and distributed a 16-page event booklet for “The Come Out” using Microsoft Word. This booklet had a schedule of the event, biographies of the speakers, a message from HUES, a memorial for a Lansing Association for Human Rights board member who recently passed, and paid advertisements. For the advertisements, I circulated a flyer containing information on how to contact HUES for advertisements and the cost for purchasing an advertisement spot. I also personally contacted local political figures and local businesses for the purpose of securing another advertisement. The layout of the booklet and the advertisement flyer can be found below.

HUES Social Media Strategy

HUES Social Media Strategy


As the first Communication Strategist for Humans Uniting for an Equal Society, an auxiliary organization for Lansing Association for Human Rights, I am deeply involved with creating a cohesive social media presence for the purposes of promoting the organization and connecting with the Lansing community. HUES currently operates on Facebook and Twitter, though Facebook is its primary platform for digital communication and plans are being made to incorporate more visual social media elements, such as Instagram.


Facebook is HUES’ primary method of communicating via social media. Over my time as the Communication Strategist, I have used the HUES Facebook to promote events, promote meetings, connect with MSU and Lansing human rights organizations, and engage in dialogues with local press such as The State News and City Pulse. I also reinforce the credibility and the ethos of the organization through posting articles concerning human rights issues that speak to promoting openness, diversity, and inclusion of all marginalized identities, often pulling quotes from the articles to attract potential readers. Below are examples of posts that I have made, as well as a link to the HUES Facebook.


Twitter is HUES’ secondary method of communicating via social media, and I am beginning to implement our new social media strategy through Twitter. Currently, I am using the HUES Twitter to promote events and meetings, as well as to establish the credibility of the organization through retweeting articles concerning current issues pertaining to human rights. I have also connected HUES with local MSU and Lansing human rights organizations in order to keep the organization updated with news and events pertaining to the local human rights movement. Below is an example of a post that I have made, as well as a link to the HUES Twitter.

Facebook Analytics Data

Facebook is HUES' primary method of social media communication, so I decided to focus my efforts at analyzing data from that platform over Twitter. I pulled analytical reports from Hootsuite, as well as data from Facebook's "Insight" tool, emphasizing gender and age breakdowns in fans, top performing posts, engagement rates for posts, and date ranges when "likes" were higher than our average. Examples of data pulled can be found below.

Social Media Strategy Document

I analyzed how HUES' social media is currently being utilized, as well as how the social media could potentially be utilized after analyzing the data from Facebook's "Insight" tool and the data from Hootsuite. I also offered a list of guidelines for future Communication Strategists to use in order to increase engagement with posts and increase the number of likes on the Facebook page. The strategy document can be found below.

MSU WRAC Content Strategy

MSU WRAC Content Strategy


I worked within a small team to create a new content strategy for MSU’s Writing, Rhetoric, and Culture (WRAC) Department website. This was done by conducting interviews with WRAC staff and website users, as well as by conducting research into the way that content is structured and displayed on the website. This strategy was later presented to the client for approval.

Content Strategy Document

The strategy document that we created presented a new strategy through providing a style guide, wireframes, sample digital campaign articles, metadata suggestions, and a governance plan. Our primary goal was to further separate the content into more clearly defined categories, funneling WRAC's multitude of audiences (first-year writing students, Professional Writing majors, grad/PhD students, faculty) to content specifically designed for them. We also aimed to emphasize the creation of content that brands the WRAC department, giving it a defined identity within the MSU brand. The strategy document can be found below.


As an educator, I create curricula that engages students in reflection on their roles as problem-solvers, team members, and citizens in various communities, helping them craft their identities as they actively learn.

"Tuesdays With Morrie" Unit Plan

"Tuesdays With Morrie" Unit Plan


Instead of having teacher-led, large class discussions over Tuesdays With Morrie, I wanted to give students a sense of autonomy and direction over the discussion topics. Instead, I decided to create a unit completely dedicated to small-group discussions. Students would create questions based off of the readings, student discussion directors would lead small groups through dialogues on those questions, and students would fill out a participation evaluation to determine how well they prepared for and contributed to the discussion. This was done to engage students in an active learning experience where they decide the direction of their learning, all while still providing a structure for students to follow.

Discussion Guidelines

Before having students engage in student-led small group discussions, I took a couple class sessions to discuss how to actively listen, how to lead a discussion, and how to respond in a dialogue in order to perpetuate open dialogues. After this discussion, the class practiced engaging in dialogues, evaluating how successful the dialogues were. This was done to model for students how small-group discussions should operate, and, as a result, they were able to successfully engage in these discussions at the very beginning of the unit. The artifacts below are some of the materials I used in these lessons on dialogue.

Discussion Structure

During these discussions, students would work in groups of 4-5, each student choosing a question from his or her daily list of questions to give to the discussion leader for the purpose of proposing it to the group. Students would spend 30 minutes of class time working through these questions, taking notes on the answers that other students provide. While students fill out their daily reflection form, where they assess their participation and performance during class discussions, I would walk around and check to make sure all students were taking notes during this. All of this was designed so that students were fully engaged throughout the entire hour. A sample daily reflection form can be found below.

Final Reflection

As part of their grade for the unit, students had to answer a few reflection questions based on their personal assessment of the novel, their ability to create lines of inquiry, and their performance during class discussions. These questions were specifically chosen to reflect the skills emphasized during the unit. A sample student response can be found below.

Creative Writing Poetry Lessons

Creative Writing Poetry Unit


When I taught the senior Creative Writing class at East Lansing High School, I wanted to approach the poetry unit in a way that would allow students to reflect on their personal identities and the way they interact with artistic media. In mixing this approach with an academic overview of poetic devices, this gives students a more personalized introduction to how poetry operates both within larger cultures and within their own lives. To accomplish this, I led a critical analysis of Beyonce’s “Pretty Hurts” and Tupac’s “Changes”, showing the intersections between pop culture, poetry, and personal identity.

Beyonce "Pretty Hurts"

This song was specifically chosen for a couple of reasons. I wanted to choose a female artist, as well as an artist of color, and I wanted a song that touched on a cultural issue that students would recognize as one that affects them personally. It was very important to me to have diverse representation of culture in the art analyzed in my class, as well as art that students recognize and connect with. I had students listen to the song once while only reading a paper copy of the lyrics, then again while annotating their paper copy with any thought and idea that occurred to them. Afterward, I led the class in a discussion commenting on the way that poetic devices in the song enhance communication of the theme (beauty standards, self-image, etc), as well as how well-suited Beyonce is to discuss the theme. My annotated copy of the piece and my lesson plan can be found below.

Tupac "Changes"

This song was also chosen specifically, as it was done by an artist of color and also commented on a cultural issue that impacts people of color. I wanted to initiate discussion on modern racial and economic issues through a lens that students would find approachable, such as a notable rapper. I used the same approach as the Beyonce lesson, having students first listen to the song while only reading a paper copy of the lyrics, then having students listen again as they annotated their paper copy. Afterward, I led a class discussion on how Tupac uses stanza structure to communicate a clear thematic narrative, as well as what issues were being discussed within the song. My annotated copy of the piece can be found below.

"What is a Hero" Project

"What is a Hero" Project


In the English 1 class at East Lansing High School, one of the thematic units revolved around the idea of the hero. To introduce this unit, I had the students work in groups to create criteria for heroes and to collectively draw their vision for a hero. This allowed students to develop their own definition of "hero" and analyze that definition in comparison to those around them.

Project Details

In the English 1 class at East Lansing High School, one of the thematic units revolved around the idea of the hero. To introduce this unit, I had the students work in groups to create criteria for heroes and to collectively draw their vision for a hero. This allowed students to develop their own definition of "hero" and analyze that definition in comparison to those around them. The assignment sheet for this project can be found below.


If you are interested in working with me, please feel free to reach out to engage in a dialogue with me.