Interactive Design: Final Project- Design, Exploration and Application

on
4/11/2022- 2/12/2022 / Week 10- Week 14
Chuah Kwai Pin / 0348376
Interactive Design / Bachelor of Design (Hons) in Creative Media / Taylor's University 
Final Project- Design, Exploration and Application 

LECTURES:

Completed in Exercises blog


INSTRUCTIONS:


Final Project: Design, Exploration and Application

Showcase of sub pages

1. Customised Bento Cakes

Consists of information regarding the lettering, designer and expression cakes. There are also carousels showing sample cake designs ordered by customers previously, but customers can order by sending in a design of their choice. The price of cake is included followed by the steps to order. There is also a collapse section where the order form shows when the Order Now button is clicked on.

Fig 1.1 Customised Bento Cake Subpage

2. Gourmet Flavours

Consists of the 6 gourmet flavours and its information and ingredients. Users are able to click on the cake pictures in the gallery above and it will link them directly to the cake that they are interested in so that they do not have to keep scrolling.
Fig 2.1 Gourmet Flavours Subpage
3. Specials

Similar to the Gourmet Flavours Subpage concept, this page consists of the specials bakes that users can purchase. Clicking on the pictures at the top gallery will link them to the specific cake below.

Fig 3.1 Specials Subpage

4. Added to cart

Once users have added their order to cart, it will link them to this page saying that their order has been recorded and the admin of the page will contact them for further info (i.e. design of cake, house address, etc.). There is also a more cakes below where users can also browse other options as well.

Fig 4.1 Add To Cart Subpage

5. Login / Sign Up

When users click on the login button at the top of the page, they will be linked to the login subpage (Fig. 5.1). If they do not already have an account, they will have to click on "Register here" and it will link them to the Sign Up subpage (Fig. 5.2)

Fig 5.1 Login Subpage


Fig 5.2 Sign Up Subpage


FINAL OUTCOME

Submission of Netlify link: https://chuahkwaipin-assignment3.netlify.app/index.html

FEEDBACKS

-

REFLECTION

Coding 5 html pages really did take up a lot of my time and energy (both mentally and physically). It was a really long process of work, and even though I was already quite familiar with how to code using bootstrap and CSS, it still took me a lot of time. I think part of the reason why it took a longer duration to complete is because the designs and layout for all the subpages were not finalised beforehand. Unlike Project 2 where we had already established the design and layout in Project 1, for the subpages in this final project, I had to imagine and picture it in my head and then translate it out as a code. Fortunately, since it was quite flexible, I just went with the flow and make necessary changes along the way. 

Overall, I would say that it has been a really long journey of self-learning and discovery for this module. I have to admit that it is quite difficult to learn everything about coding just by watching and listening to lectures, because there is just so much to it. The best way to learn, in my opinion, is through practice and facing the challenges by ourselves. Last but not least, I am really glad I managed to pull myself out of every pothole I accidentally dug into and finished all of the html subpages.

Comments

Post a Comment