Creating a job listings site for two studios

The Brief

Our team was tasked with creating an overview site for job listings for two of Square Enix' mobile studios. This page would show a consolidated list of available positions in the Montréal and the new London Mobile Studio and be distributed via QR code at an event. The individual job listings are hosted separately by each studio.

The Process

Since this page is meant to be distributed via QR code and would mainly be viewed on mobile in this fast-paced setting with little time to engage the user, we decided to stick to a minimalist design to minimize distractions.

Due to our tight schedule, we had only about a week at most for development, so it was important to finalize a design as quickly as possible. We adopted a "mobile first" design approach by identifying the key elements for the mobile user from the existing job sites of both studios, and stripping out the rest.

I started with some low fidelity pen and paper sketches to explore possible layouts, keeping in mind the established job sites. On my initial pen and paper sketches, I added both a location filter to allow users to view jobs in their preferred city (London or Montréal) as well as a smart drop-down to search for specific jobs. Upon first load, all jobs would be displayed on the site and the user could either filter by location or start typing into the smart drop-down to filter jobs by category.

When I was happy with the layout, I translated my hand-drawn wireframe into Adobe Xd and then created a prototype to show the behavior of the filters. This was especially helpful in helping the stakeholders visualize how the site would work and I involved the Senior Web Development Manager, the QA Manager as well the Senior Designer in the feedback process.

Upon reviewing the lo-fi prototype together with the development team, the scope of the project had to be narrowed a little: the search function was removed due to the small amount of actual jobs that would actually be listed on the site. This was done to avoid user annoyance as it required more effort from the user to use the search bar which was not suitable for the busy setting this site would be used in.

After these adjustments were made and the design was finalized, a desktop version was made by the designers and all versions of the design were skinned to contain Square Enix's signature color scheme of white, red and black.

Shortly after, the site was built including all job listings that linked to the appropriate studio's website. We tested the site on multiple devices to validate our minimalist approach to the design and to ensure that it scaled well on both mobile and desktop.

Learnings

This project has taught me that sometimes, simplicity is key and that features that do not fit the scope or the intended use of the project can be cut, if necessary.
Despite the time constraints the project was shipped with some time to spare. Our developers work on multiple projects simultaneously, so it was important for both the design team, the stakeholders and QA to be in constant communication with them to ensure everyone was on the same page.

← Back to Portfolio Overview