Anti-Racism Commitment Coalition

Overview

The website joinarcc.org is being managed and improved by me as a Web UX intern for the Anti-Racism Commitment Coalition (ARCC). As an NGO, ARCC uses their website as a point of outreach thus making it central to their operations.

Project Duration: Currently Ongoing

Team size: 1 (me, hehe)

Roles: Web User Experience Designer, Web Developer

Deliverables: Website (https://www.joinarcc.org)

Project Specifications: WordPress (Beaver Builder Plugin), Figma, Zoom, Captivate.fm, Google Docs, Google Drive, Whatsapp

Achievements

Within 3 weeks of my internship, I fixed an Email notification issue that ARCC had been dealing with for more than 4 months.

Improved Website Navigation and made the design look modern and up to date.

Redesigned the website to make it easier for the visitors to skim through the website and focus on the important information.

Joining ARCC

These were important factors to consider. So, even though I was rejected for the role of intern, I emailed my interviewer to ask for a volunteering position at ARCC. He happily offered it to me, and I kept in touch with him constantly to obtain new tasks. After two weeks, I get an unexpected email from him saying that the previous intern did not work out for their specific purposes and they would be happy to have me onboard as an intern. My supervisor mentioned that my active communication and professional demeanor encouraged him to reconsider me for the internship.

I happily accepted the offer and got to work on October 18, 2024. I am currently working as the web UX intern at ARCC and it has been going great!

I joined ARCC in October, the interview for which happened in late August to Early September. I was initially denied the opportunity based on a misunderstanding, but seeing how ARCC provided me with:

  • An NGO that I would be proud to work with.

  • An opportunity to work on a website that holds a lot of importance for the NGO as well as the visitors.

Responsibilities and end-goals

Since I am the only Web designer and developer at ARCC, the responsibility of running the entire website falls on me.

  • Improving the website’s design and adding new elements wherever necessary.

  • Improving the user experience through the help of internal and external surveys and feedback.

  • Formatting and Uploading blog posts and articles regularly submitted to me by other ARCC interns.

  • Uploading podcast episodes regularly submitted to me by ARCC’s founder.

  • Maintaining subscriptions and APIs in the back end so that they do not expire.

  • Fixing a very specific email issue which is preventing the official ARCC email from receiving notifications from the website’s forms that the users fill and submit.

The end-goal of my internship at ARCC is to maintain a well-functioning website and improve the user experience. By the end of my internship, the website should be better designed and updated to the current design standards, the user experience for visitors should be significantly improved and my successor should have a well-written document to handle all the website tasks moving forward.

Achievements

At the time of writing this paragraph, I have been with ARCC for less than a month, but I have already had some achievements that I am proud of:

Problem

The Email Issue: ARCC was suffering from an issue with their Email ever since summer of 2024. They had migrated their website from Squarespace to GoDaddy, but in this process they lost the ability to receive emails on their official email ID, the domain if which they had purchased from Google.

This was a critical issue for ARCC, as their website is the central point of contact for new visitors to not only talk to the ARCC but also to apply to ARCC as a volunteer. The previous interns called Squarespace and GoDaddy several times, but the issue was not resolved.

During my onboarding, Jeremiah (my interviewer and ARCC supervisor) mentioned clearly that fixing the Email was a task of the highest priority and it was the first thing I needed to go at. To be honest, that scared me a little. I wasn’t sure what the issue even was, and Jeremiah had no clue either. The previous intern had left abruptly and the intern before that had no clue how to go about solving this problem, so I was left on an island of my own, with a clock ticking in the background.

After my onboarding, I spent a few days understanding the WordPress ecosystem that the website was using. I made some minor changes here and there and posted a few blogs given to me by the team. This helped me build confidence in my ability to handle the website functions and move to more troubling issues. All this while, the Email was at the back of my mind. I finally got to addressing it 2 weeks into my internship.

My Approach

My immediate instinct was to go into the SMTP settings on my WordPress Dashboard for the website, to check which emails were we using for website notifications. The settings showed that the email we were using was right, but the service for email communication was set to default. To check the issue for myself, I tested making a change on the website that should send an email directly to the website’s associated email address. When I did not receive the email, I went back to the SMTP controls and changed the service provider to Google. After some confusions that I resolved via some Google searches, I learned how to use Google’s email services for WordPress websites. The Website’s email already had Gmail services running for it on Google’s admin panel, all I needed was to generate API credentials. After copy-pasting these credentials, I tested the website again, excited to have solved the issue on my first try….and…. the issue still remained. No email was received, and I was back to square one.

I had no idea about how to go forward now. I went back to the problem the next day, and googled aggressively for similar issues other people have faced on WordPress or GoDaddy. I applied a few of the suggested solutions, but they did not work either. Then I put this problem on the backburner again for a while and focused on other areas of the website that needed some attention.

The Solution

I got a text from Jeremiah (my supervisor), asking about my progress on the Email issue. I told him the things I had tried, and said I would get to solving it soon. He encouraged me to call Squarespace and GoDaddy like the previous interns had done. I was skeptical about this approach because it hadn’t helped earlier, but he persisted because the issue was the main reason for me being at ARCC anyways. I agreed with that sentiment, and I told him that I would call them the next day. When time came to work on the website, I decided to give it one last try before calling the companies’ support.

This time, I first checked all the “users” that were added to the website to try to understand who was and wasn’t getting the email. The problem had been presented to me as website issue. I was told that there was some disconnect between the website forms and the backend email. But when I opened the company’s Gmail account and looked at the inbox, I noticed something that I had missed on all of my previous visits. That Gmail account had not received a single email since July, not even a spam email! That set sirens blaring in my brain. I thought maybe the issue is with this Gmail account itself not being able to receive emails, rather than the website being unable to connect to this particular Gmail account because GoDaddy was sending website-related notifications to me and other email account automatically. I tested this hypothesis by sending an email to the company email from my personal account and the email just never reached. That was a confirmation for my hypothesis, and now the problem had shifted from a website connection issue to a Gmail inbox issue, which also meant that I would have no success calling GoDaddy or Squarespace because it was not an issue pertaining to their domain.

Then, I went to the Google Admin Controls directly to see the email IDs that were set-up during the transfer of the website from Squarespace to GoDaddy. I dug a little deeper and voila! I found out that the ARCC emails with the new Gmail domain, i.e. @joinarcc.org were not enabled to receive or send emails. It took about 5 minutes to get them activated. Once done, I tested it again by sending an email from my personal email id and this time it reached the destination!

Then I checked all the forms on the website and all of them worked, sending emails timely and properly. Thus, the issue was finally resolved and although it took me around 3 weeks, it was the source of months of trouble for ARCC!

Problem

The website had a lot of information and interesting content for the user since the start of my internship. Unfortunately, the information was not properly highlighted. Although one could make out the structure of a webpage on the website, a user could not easily skim through the information to find something that piqued their interest because that kind of engagement was not facilitated by the design.

My Approach

On some inspection, I noticed that the color palette, especially the surface colors, were under-utilized. Everything on the website was written on a white background with only some negative space separating them. Although negative space is a good way to prioritize and structure content, it wasn’t enough in this case. The separation between two different columns, and the children of that same column was the same. They looked like they all belonged to one grid. Also, the website used ARCC’s primary color for headings, and secondary colors for subheadings. The negative space alone was unable to overcome so much visually striking text.

The Solution

My simple solution was to add some separation between the sections containing important information by using the site’s existing color palette. This change immediately uplifted the content and gave the user subtle hints about where they should pay attention when the webpage was loaded.

I understand that the solution might feel “too simple” to some, but often times the solution to a problem is simpler than we think, and simpler solutions should always be prioritized because they offer scalability and easier understanding for successor designers when the time comes to take over.

Problem

The website’s top navigation bar was colorless and at time, blended with the background when scrolling. The dropdown menu from the navigation bar also gave a feeling of being dated. It was the same color as the navigation bar and had a very noticeable drop shadow, which is something that modern websites and apps have moved away from. Drop shadows nowadays are very subtle and only function to elevate the content, instead of being noticeable themselves. The current design trends are rounded corners, glassmorphism (to some degree) and flat design. Dark, noticeable drop-shadows are left for 3D or 3D appearing objects.

My Approach

This one TOOK A WHILE! The dated dropdown menu was the first thing I noticed when I visited ARCC’s website for the very first time. But I couldn’t find a way to edit it anywhere! I tried the WordPress Beaver Builder documentation, I tried Google and YouTube videos, but they all pointed me to a “style” menu that did not exist! So, I had to leave the dropdown menu there and focus on other issues in that moment.

The Solution

One day, while working on the website, I accidentally stumbled upon a dropdown menu in the toolbar of the website builder, and it had two options - Header and Footer. I clicked on the “header” option to see if I had finally found the goldmine and it turns out THAT I DID!

The navigation settings were a little weird for me and things didn’t seem to be working like they were supposed to. At one point, I ended up deleting the navigation bar altogether and had to drop an emergency message in the ARCC group about the changes. Thankfully, I was able to revert to the previous state of the website.

Having learned my lesson, I went forward wiser and braver and finally fixed the top navigation and the dropdown menu. The satisfaction was immense, and my day was made!

What’s Next?

My next steps are to continue making the website better. Even though I have made some UI changes to make the website look better and more up to date, there’s still more to do, especially in terms of the user experience.

  • To improve the user experience, I will need to conduct user research and surveys, both internal and external which I am currently preparing to do.

  • Continue performing my regular functions of uploading blogs, maintaining the expected functionality and managing the podcast.