Sleep with bugs, Get up with new bugs

After finishing the last prototype of Figma, I turned the pages of Figma into a website. But the biggest problem for me is that my website may not be as practical and beautiful as the prototype of Figma.

For me personally, creating assignment 4 was like being a UI designer, I spent a lot of time on how to make the prototype more beautiful, so I even used a lot of iconic elements to beautify it. But when I started working on assignment 5, I realised that there was a big difference between the web and Figma. In Figma, for example, my prototype has multiple levels of jumping and a side navigation bar. However, the different templates assume different CSS and js files, and you can never imagine what the site would look like with the new templates. Because the CSS file names of these templates are so uniform, it is often the case that the styles of the same elements overlap and the desired effect is not displayed.

After a number of nights with only 5 hours of sleep, my website finally came to an end. But this was followed by a new problem, which was to move the files from visual studio code to Jupytor notebook and then upload them to pythonanywhere for the final rendering of the site.

I encountered the same obstacle countless times during the process of moving: after moving and changing the path, the content that could be displayed locally still did not render as it should. To add to the pain, I had a total of 20 pages, which I had designed to provide a better experience for the users of the site. But this is also where the groundwork for my constant debugging stems from.

After the final production, I conducted a usability test. after asking a new round of respondents, the Usability test.

Usability test:

The usability test was used to find out whether my bounces were not what the participants expected, whether all my pop-ups made sense and whether the participants found the site easy to use. So I designed five tasks to observe the real problems they encountered in performing the tasks via video conference link. The five tasks are:
1. Where would you click to browse coffee shops?
2. Add one coffee shop to your favourites and check all your favourite coffee shops
3. Where would you buy coupons for stores?
4. Register and log in
5. How would you upgrade your VIP package?

Apart from that, I add an important additional question about the willingness to pay for the VIP membership, which is closely related to monetization.
6. Would you like to pay for the VIP membership and why?

A/B test:

A/B test is designed to test whether a more detailed member profile will attract more website users to sign up as members. In this test, what remains the same is the sign-up prompt, including the title, e.g. “Sign up now and become our exclusive member”, and what changes is whether or not to place the features and benefits of membership up front on the sign-up page to give more exposure to the benefits of membership, which might therefore increase the desire to sign up.

The original version: The difference between the benefits of paid and regular membership is placed first, followed by a screen to fill in the registration information.

Varient 1 version: Only the registration information screen is placed.

You can access my page here