Bengawan Solo
Website Revamp

Client

Bengawan Solo, School of Film and Media Studies

Date

May’17 – July’17

Deliverables

2-Page Website

Tech/Tools

None

00 Brief Summary

My class was tasked to revamp an old Bengawan Solo website for our first assignment in a Year 3 elective module Integrated Digital Media (IDM). This individual assignment got me an A+ grade for good responsive media queries and excellent UI/UX improvements from the old website.


01 The Problem, Goal and Task

The main problem is that the current website is just super old, outdated, and not functional on mobile.

Thus, the goal is to make the website more modern, useful and responsive.

The task is to code 2 responsive pages and provide UI and UX improvements to the current website.


02 Landing Page

The landing page features an attractive hero slider displaying the various categories of food Bengawan Solo has to offer. The large photo display encourages users to click the image to link the user to the specific product page/section.

It also features 3 sections accompanied by an attractive stroke-animation showcasing Bengawan Solo's Unique Selling Proposition (USP).

Additionally, I included an email sign-up form for Bengawan Solo to collect its users email to provide promotional newsletters and to make its customer keep up to date with its latest confectionaries.

03 Products Page

The product page features a hero header with clickable product tags for the user to go to each section quickly. Each section feature a card displaying the product information, such as price per slick or box, stock availability, and a button to see which stores the product are available at.

04 404 Page

Since I am only required to code up 2 pages, I added an additional 404 page for the other fake links I created throughout the website. The 404 page features what the revamped Bengawan Solo website may actually implement – a link back to the home page.

05 Personal Experience

This was one of the first website I coded in 2017, after almost a year ++ break from the moment I learned proper coding. Thus, it was quite a difficult assignment, and I was rushing against time, but due to my perseverance and determination to implement cool features into a modern website, I pushed through and managed to do excellently in the assignment.

I am also glad to be able to learn the ins and outs of User Interface and User Experience. In fact, if I remember correctly, this was the assignment that pushed me towards UI/UX as I find it really interesting. This was the assignment that started it all for my career as a UI/UX designer, to eventually getting me an internship abroad.


Why not view the actual thing?