UI design by Katharina Winter
What makes up an online voting system? Who is it for? What do users expect? How is this product unique?…
I had a lot of questions about the Polyas product. I met with heads of development, individual developers, product managers, and business owners to fully wrap my head around the online election process and the product offering.
From these meetings, I identified feature requests and the phases and actions in election creation.
Once I had an understanding of which actions are required to set up an election, I needed to determine the proper sequence of actions according to what makes sense to users.
I conducted a series of card-sorting exercises where I asked users to organize a list of actions into logical groupings.
Card Sorting Results
I broke up the process into 5 smaller steps and gave clear indications where the user was.
When a user clicks “add new page” an accordion control is created and automatically expanded with a name field and a description field. The inputed name text becomes the accordion label.
Any invalid voters would be separated from the valid voters and the appropriate error messages would be displayed.
If there are more than 3 languages, this tabbed control becomes a dropdown menu.
When there are more than 10 voters, implement paging with paging controls found on the top and bottom of the results.
Main nav remains fixed when scrolling until the user reaches the configure / preview section.
Pricing scrolls up with the rest of the page but once the user has done something that changes the pricing plan or the cost, the pricing bar should slide back down to its position below the nav bar, remain fixed for 3-4 seconds to let the user know there has been a change, and then slide back up.
Since Polyas was a very complex product with many different screen variations and configurations, I found the best approach was to build a clickable prototype.
With Invision I was quickly able to link existing pages together as well as build out a few functional elements. I also created precise documentation that outlined key interactions and use cases.
In order to assist the developers in their efforts, I created precise documentation for mobile, tablet, and desktop versions of the app.
I called attention to key interactions and behaviours that I showcased in the html prototype.
Polyas was a really fun product for me as I enjoyed working through the complexity of the system. We had almost daily meetings with the client and accomplished quite a lot in just a couple of weeks.
Basing design decisions on user testing and research is always ideal but doesn’t happen on every project. With Polyas, I was able to push things more in this direction and I think the product benefited greatly from that.
As a next step, it would have been great to do some field testing and data collection with the actual product to see how users interacted with the election system.
