So for this week all I mainly did was implementing the registration form itself as part of the client project. Design and layout at the moment is not of utmost importance, but to ensure that the required functionality is there.
UX in the Online Store
Before I dive into that, I’ll talk about the problems we had when extracting the data from a webhook.
- Differentiating specific products from other products in the online store.
- Extracting user information in the simplest way possible.
Firstly, we could have various products in the store apart from the ones that our system needs to handle. For the second problem, remember how I mentioned we will have a webhook that triggers when an order’s status is updated? Well, it turns out the JSON data they send do not include all the details needed for each product within a particular order. One solution to both problems is that we assigned a unique identifier to each products (similar to a barcode), in WooCommerce it is called “SKU”. Doing that would definitely help us to distinguish products, and it is also part of the data that is sent by the webhook. However, as highlighted by Dr Shawn, that itself is a problem because for each product made the identifier has to be manually key in, and being human, there is a tendency for us to make mistakes.
As a software developer, we should always put ourselves in the shoes of the users. In this situation, we have two kinds of users: the ones visiting the store, and the ones setting up and managing the store. Our clients themselves would be setting up the online store, hence in a sense we are trying to make their lives more convenient and reduce unintended human errors. Fortunately, we were able to discover a better solution, i.e setting the product attributes. In WooCommerce, you can have variations of a product through their attributes (e.g: a T-shirt can come in different sizes like S, M, L).
We would help the administrator set these attributes, and would make sure they include them in the specific products. Depending on how the client wants to set up the store, we could set a default attribute for a particular product that resides in a category, and it would be the only option for those attributes. The reason why we wanna do this is that JSON data send by the order updated webhook would actually include those attributes that are used as variations for the product, so that is terrific.
UX in the Registration Form
The registration form is actually the very essential part of the whole system to capture each individual participants’ information. Therefore, some security measure is needed. The URL to the registration form has a query string that holds the order ID and a hash value. It would be included in an email that the registrants would receive after making payments. This is to ensure that no one else could just simply access the registration form without actually receiving the URL themselves. What if the email address given by the user is actually someone else’s email address? Believe it or not, it could happen. Which is why as soon as they access the registration form, it is required that the registrant check if their details they filled in earlier are correct, and we would intentionally leave one field blank for the registrant to fill in (e.g: their phone number). Once all that is verified, the registrant can then proceed to fill in the participants’ information.
Again, we should always think about the user in their perspective. The registrant may not have time to fill in all the details in the form, which is why we give them the option to save the form as it is and they could safely exit the application. When they access the form again, they would get the same form that they saved earlier, without having to fill in the whole form again.
I learned a few things about good User Experience this week. Even though I didn’t managed to finish everything as Dr Shawn hoped by this week, I should be able to get it done somewhere next week. All I have left is a change form, if the registrant needs to make any changes, and the expected output of the system, i.e the generation of registration slips, certificates of participation and a spreadsheet, detailing the participant’s information, that would be fed as input to an existing system done by a previous intern.