Designing Internshala’s Careers, About Us and Cultures page
End to end process that we followed during designing these pages
For all those who don’t know, Internshala is a technology company on a mission to equip students with relevant skills & practical exposure through online trainings, specialisations, fresher jobs, and internships.
And what people only in the IS universe knows that Internshala focuses so much on the cultural values and work environment, maintaining a balance between work life and personal life and we wanted our potential hires to learn this through our careers page itself.
We conducted approximately 20–25 user interviews wherein we tried to understand the emotions of the user when they visit these pages, what were their thoughts on the content, the sections and what they felt could have added value to these sections. We also tried to analyse what they loved the most about the organisation which people from outside be interested in knowing and we concluded our user interviews by doing SWOT (Strength-Weakness-Opportunities-Threat)analysis in order to move ahead with the site mapping.
Concluding our User Research and Competitive research, we had couple of objectives directing our approach:
- To reach out to the best talent, get them to know about what working at Internshala is like, talk about our work cultures, ethics, and motivate them to apply for a job opening.
- Highlighting our diverse work culture.
- Making our Careers, About Us and Culture page more playful as the older User Interface is a bit mundane.
So we were a team of 4 designers. I and Swarnima were the product designers, Allrich and Tanvi were the digital illustrators, and for all the approvals and guidance we had our Principal Product Designer Shivani and from Product, the project was led by our Product Manager Amisha.
During ideation we realised how other companies use quirky and interesting content in order to keep the visitor’s interest intact so Content team was there for us to help on the content.
As soon as we concluded our research, Swarnima and I started looking at what all sections were mandatory and were common in every competitor’s careers, about us page and what all sections could be added which would be unique to our organisation and would add value for the potential hires. While creating the sitemap, the major thing that was there in our minds was that we have to add a Human element to these pages which was missing in our old designs and make the visitor understand what exactly it’s like to work at Internshala.
During our interviews, we analysed that the culture and work environment was a very crucial piece of information for the potential hire. We reached out to our Amisha, our PM to learn about the number of visits on each page to make a decision as to where we can keep this information for the user where the chances of the users reading that information is highest.
Data provided to us:
Page visits on all of the pages in the last one week —
- Careers page- 11,523 visits
- Culture page- 391 visits
- About us page- 3,101 visits
- Media page- 279 visits
Through this data, we analysed that the users are not explicitly going to our culture page to read about the culture of the company yet it was an important piece of information. We took a call on adding a part of our culture section in our careers section itself in order to make the page visitors learn about our culture effortlessly.
But there was one issue, when we added the culture section on the careers section, it increased the length of the page and now the “We are Hiring” section was visible on the 4th scroll. To cater this UX gap, we added a Join Us CTA on our top navigation bar for those users who might not be interested in consuming this extra information and straight away wants to go and check the available openings.
While we worked on the Sitemap, Illustrators started working on the banner image for the About Us and Culture pages. They created a mood-board wherein we saw how other companies use illustrations to make their first view-port very powerful. After days of research and creating mood-board, our illustrators came up with a CRAZY idea of creating an office view illustration wherein there would be a scene that would entirely depict Internshala’s office and how a regular day at work in the office looks like.
They shared this idea with everyone in the catchup and all of us were really intrigued by the idea but it sounded a bit difficult to implement and the major obstacle being, none of those two had ever been to the office as when they joined, it was complete Work From Home and there was no chance of visiting the office anytime soon.
But as we say in one of our culture values “Make it Happen” , they conducted a lot of interviews with the people who’ve been to the office, they asked them to recollect the memories and share with them. They collected office glimpses, photos from a lot of people who had been to the office.
After they collected all the information that was necessary to create a scene that depicted day at work from the Office, they broke down the information into minute details and came up with an entire scene.
We still remember the catchup where the illustrators shared their work and for all those who had been to the office were totally blown as it was literally a scene which brought nostalgia to them. For all those who used to go to the office, they could totally relate with the scene that was being presented in that illustration.
Kuddos to our Illustrators who worked really hard and came up with these amazing banners.
About Us Page Illustration
Culture Page Illustration
Post finalising our sitemap and illustrations, we had to explore the UI and layout in a way that’s its easy for users to navigate through. About the colour palette, we kept in mind that we’ve to keep it consistent with our brand colours so that when users land on the page, they should feel like they’ve come to Internshala website.
We experimented a lot with the fonts that would go with our Primary font “Inter” and discovered “ Nunito” for the headings of each section(It’s a google font, we used google font pairing suggestions and came up with this). But after couple of iterations and valuable feedbacks from the HR team and the Marketing team we finalised on going ahead with the Inter font only because though the font was playful and adding a vibe to the page, but it wasn’t consistent with the Internshala Design System so we went ahead with Inter font only and used Nunito only for careers page’s tagline which says “Transform the lives of students. Join us” as we wanted our tagline to stand-out from the rest of our page.
- We decided on keeping a video which shows Internshala office glimpses, employees working and having fun at the same time. Our major objective was to add a very lively vibe to the Internshala careers page’s first fold and hence we added a video to cater that point.
- In the next section which is “Why work with us?” we were initially confused whether we should use icons or illustrations for all the cards and we finally decided to go ahead with the illustrations as they are more expressive than the icons. Our illustrators worked on them from scratch and each illustration resonates with whatever we were trying to depict.
- As I stated earlier, we added a small section of our culture page to our careers page so that all the potential hires can see what values we follow at Internshala and what it is like to work here.
- Then comes the main, “We are Hiring” section. In our previous design, we did not have any segregation as per categories or departments which was a major pain point during our user interviews. In our new designs, we created sections such as Technical, Marketing, Content Development, Design etc. so that it is easier for our users to navigate through the jobs that they’re interested in.
- First viewport of our culture page was taken up by the office view illustration which consisted our Culture Wall of Internshala. To the left side is the pantry where all the employees have their lunch and most of the chit-chats happen there, to the right of it was the meeting room wherein all the meetings happens.
- As we have 11 culture values in Internshala, the major obstacle was to make the people who’re outside of Internshala connect with our culture value in some way so for that, we decided on using real images from the office and with each culture value, we shared a very short story wherein someone or a team in our office possessed that culture value in a particular situation so that it induces an emotion of positivity in the hearts of users.
About Us page
- In the About Us page as well we have first view-port as an office view illustration wherein we depicted our iconic “Do Epic Shit” wall where employees are painting the wall (which is a true story as we ourselves painted this wall in the office and didn’t take any external help. PS: Perfect example of Be Jugadu and Kanjoos :p). Alongside the wall, we have an elder human figure which we tried to depict as our CEO i.e Mr. Sarvesh Agrawal. On the Right side of the wall we have beam bag, people discussing ideas and working together which is actually how it is at the office.
- Below the illustration was the Our Vision section which gives a gist of what internshala as a brand is along with the products we are proud of. User can explore products from here and the thought was to help user learn about different verticals of our product at one place.
- Then there was a section wherein we defined all the milestones we had achieved thus far. The concept was more of show an underdog story — how we improved over years with awesome product launches and overall our brand value as company since we cater a lot of domains along with internships so how we improved and expanded over the time span.
- Earlier we had media section as a different page and through our analysis we realised that there’s not much traffic on that page so we clubbed the “Media Coverage” section in the About Us section itself.
- The last segment of this section is “Meet the Team”, this section is for the inside Internshala Universe. Whenever a new employee joins, the HR team adds their data into the Meet the Team section. We feel adding the employees on our website makes them feel valued and it’s also helpful for the activities that are organised by the HR team.
Final designs development handoff
Since everything was in place from design end, the final step was to handoff the designs to our developers, there were a lot of exportable assets so we kept them separately on another artboard with proper naming in order to make the developer’s work easier. We also had to make sure that the file size doesn’t exceed a certain amount as it affects the loading time of the page.
The engineers completed development within 1 month and then the final step was to do the UI testing (UI testing is where the designers test the entire developed project on the test domain and makes sure everything is in place for eg. spacing, text colour, layout etc.)
We completed the UI testing in another two days and then finally made the project live today(27–10–21) as I write this blog.
It was an amazing learning experience, working with people from different segments, this project was hands down one of the most amazing projects I have worked on.
And it’s a wrap!
In the end, I would like to show my gratitude to all my colleagues.
Shivani Gaur, Principal Product Designer.
Swarnima Shukla, Product Designer
Allrich Hayden and Tanvi Upadhyay, Digital Illustrator
Amisha Khemka, Product Manager
Samanta Gupta and Manisha CT, Engineers
Rohit Chowdhury and Sehal Hussain, Video Content Designers
Sakshi Jaswal and Gayatri Mudgil, Human Resource Officers
Thanks for reading till the end