Email    LinkedIn    Resume    Bookshelf    

    BY





PROJECT

hacker evaluation application


nwPlus is a student-led club supporting aspiring programmers and designers, based out of University of British Columbia. As one of their UX designers, I worked on the hacker evaluation application to organize grading assignments and hacker scoring for internal hackathon organizers.







OVERVIEW

first thing’s first, you have to set the context


Internal hackathon organizers need a classified way to receive assignments to evaluate hacker applications. This problem was time-sensitive to the launch of our hackathon events this school year, in which the first large event will be held in Jan 2022. Additionally, as the number of hacker applications increase or as the hackathons scale, it will hard to manage and grade all of the applicants.

We interviewed and sent surveys to the rest of the executive team to get insights on the challenges from previous years regarding the hacker evaluation application and process.






THE PROBLEM

what’s the problem?


Old UI

Illogical and crowded UI


The layout of the scoring page didn’t make sense - the scoring came before the application was displayed and there were too many navigation bar elements that distracted users from the completing the actual task at hand. Additionally, many of the navigation elements seemed to better suit being a filter item rather than a global navigation bar item.

Lack of personalization and convenience


From the survey answers, we found that members wanted ways to provide justification comments for the hackers that they graded, to have a personal view so that only what they are assigned will show up, and to have the rubric integrated within the platform so that they didn’t have to refer to an external document when grading.

Inability to document grading assignments


The current process begins with the presidents assigning hacker id ranges to executive members verbally and then proceeding to document it in a private Notion page. It’s hard for executives to know which sections and id ranges they are grading and there isn’t a place to see what sections other members are grading either. Therefore, it was hard to keep track of which hackers had been graded already and which ones were still incomplete.



DESIGN GUIDELINES

scoping and defining the project


How might we redesign the product so that it minimizes the exhaustive collaboration between multiple members to grade just ONE applicant?

Our mandate was to create a simple, intuitive, and modern user experience that allows the internal nwPlus team to execute their work in less time and make it easier to keep track of assigned applications to grade.

Goals


 1 



Intuitive and Logical UI
The platform will have a clean and consistent interface for executives to navigate through.

2


Personalized grading experience
Executives will only see what is relevant and be able to justify their decisions in the platform.

3

Dedicated location to see assignments
Presidents will be able to assign members, track progress, and delegate in one place.




PROCESS

here’s how it’s done


The first things we did was go through the application logic to see how to get to each page from the dashboard. We looked and researched into different layouts of how we could display the information in a way that made more sense and was easier to navigate through.

Applicant application flow








Brainstorming for assignment and scoring pages



SOLUTIONS

here’s what really happened


It’s important that the hacker evaluation application is accessible and convenient to all internal team graders. I updated 4 features:
  • Information Architecture of the scoring page
  • Creating the grading assignment page for the presidents
  • Adding the rubrics within the platform so graders don't have to refer externally
  • Adding personalization features like comments and personal views to make the grading experience simpler and backed up with justifications

Restructured Information Architecture


To increase the logical flow of information throughout the platform, I flipped the score and hacker information sections in the scoring page. It didn’t make sense for the scoring to come before seeing the application.

Scoring page (before)

Scoring page (after)

Addition of an assignment page in the application


Originally, the assignment was just a verbal assignment and the members had to remember which ID ranges and sections they were assigned. This often led to miscommunication because people would forget what they were assigned and the executives didn't have a way to see which sections they've completed already. Now it’s can see it all on this page.

Assignment page

Integrated rubrics


Rubrics can now be filtered into sections and are found within the grading ecosystem, reducing the need to keep another tab open with the rubric in a third-party application.




Rubric

Personalized comments


Since there are multiple executives that grade each application to reduce bias, we added comments so that others can see the justification behind why the grade was given for each section (eg. why did Alice get a 4 in the Github section?)



Scoring section (old)
Scoring section (new)



CHALLENGES AND CONSTRAINTS

not everything went our way...


The logic of the assignment page was very difficult to figure out and it was confusing due to technical constraints. We went through multiple iterations to end up on the current one.

Additionally, as the developers had many projects in their timeline, there were many features that we had to cut out for the MVP so that they can implement it within the year.



KEY TAKEAWAYS 

what did i learn?


Just because you can, does that mean you should?

It’s important to regularly check up with the developers to ensure that everything is feasible early on during the process before designing something really aesthetically pleasing but not functional for the particular use case.

How else can we do this?

I discovered that the logic of the entire assignment process was very difficult to figure out because there are so many factors to consider when delegating the work to the executives.

You won't always get a consensus

When talking with the developers and other designers about my ideas, although we're expected to be the domain expert, no one has more context on the problem that I do.
I was hesitant to mention some of my ideas sometimes but through this process, I learned to trust in myself and my abilities more.

You don't have to get everything done right now

At nwPlus, we get a lot of autonomy and full responsibility regarding the projects that we take on. Something that I learned was the importance of prioritization and to focus on what can be accomplished at the moment and what can be be pushed further down the pipeline for development - We don't have to get everything implemented right away. Being able to let go of certain features at the moment will help with progress and prevent me from spreading myself too thin during the process.


NEXT STEPS

Exciting next steps


This application will be used for Western Canada's Largest hackathon, nwHacks 2022 to grade hacker applications in order to see which applicants to accept into our competitive hackathon

Coming Jan 2022. Stay tuned.