Women Who Code’s Core Team has spent the last several months working on a feature that will change the way that you interact with the organization online in a profound way. This involves a complete reimagining of how Network Profiles look and function, with the hopes of giving each Network a place on WomenWhoCode.com where they can tell their unique story; both the legacy of its past, and the continuing and exciting developments of the future.
The intention of this project, in its essence, is to fulfill the needs of Network Leaders and members. To this end, the WWCode Core Engineering Team have been listening to the community, and incorporating years of feedback and insight gained into this project.
One of the main things that we learned by listening to you, is that Leaders and Members wanted a place where they could express their individual Network’s story. Women Who Code is a global organization, but each Network has its own history, its own culture and shared experiences. As we redesigned the website Network pages we kept this value top of mind.
Highlights Page: This section contains an overview of everything happening with the Network. This includes a preview of upcoming events, Network specific announcements, Tweets from the Network, blog posts written by the Network’s members, and job posts that are local to the Network’s city. It allows you to see everything that is currently relevant to that Network and its members and keep up with things as they develop.
Revamped Events Page: The Network Events Page has been revamped with a cleaner, more focused, and functional design, that makes it much easier to see all of the upcoming events a Network is hosting. We also have direct links on each event listing, allowing you to sign up for the event or place yourself on the wait list.
About Page: This tells the Network’s story including how and why it was first formed, who its most important sponsors and supporters are, as well as any unique facts that pertain to that particular Network. In addition, it lists both current and past Leaders, and ApplaudHer’s for members from that Network.
Get Involved Page: This page details all of the different ways that individuals and companies can get involved with that particular Women Who Code Network. It also has a “Get Involved” form at the bottom, that can be used to indicate your interest and request more information about ways you can participate in and support WWCode.
How We Built It
We started out by listening. For years now we have been actively gathering feedback from WWCode Leaders and Members about what they want from the website, and in particular, their own Network page on the site.
Over time the most prevalent thing we heard is that Leaders wanted a space that felt like its own separate website. Many people indicated that this could be accomplished by providing different tabs, leading to different features and pages. They also stressed the importance of being able to communicate with their members when something special was happening.
The following are the original wireframes we used when planning the design.
During the design and development process we continued to incorporate the feedback we received during the User Research Phase. On the front end we employed a mix of ReactJS and Rails Templates. On the back end we used Rails and Elasticsearch. The entire website is a Ruby on Rails app, and we use Elasticsearch via searchkick for efficient and easy search
We started as a Rails monolith, but more and more we’ve been incorporating React into our front-end. In the past we’ve been passing data via instance variables from controllers to views, all in Rails. Now and moving forward we try to use JSON API’s wherever we can.
Long term, the goal is to separate our front end and our back end into different applications. That will allow us to keep concerns and issues distinct, and address them using best practices and the best tools for each job.
Check out the new WomenWhoCode.com Network pages for yourself! https://www.womenwhocode.com/networks
Are you interested in joining the WWCode Core Team and contributing to our projects? Contact us here.
Women Who Code is hiring! We’re currently looking for a Senior Software Engineer to join the team. Check out the job post!