INTERACTIVE DESIGN - PROJECT 1 & 2

-

13/05/20 - 27/05/20 (Week 5 - Week 7)
Phoebe Ansel (0340165)
Interactive Design
Project 1 & 2
INSTRUCTIONS

Project 1

For our first project, we were asked to create a landing page design based on the topic that we decide. I decided to go for an online jewelry store called 'sweetpeeps'.

So I decided to look at inspiration on pinterest.

fig 1.1 reference



Then I started designing my landing page on illustrator. I decided that in the landing page I will include a navigation bar, a carousel in the header section promoting the brand's newest collection, a product section to categorize the products, a 'lookbook' section, a brief introduction or story about the brand, and a 'sign up' button for the call to action, and the footer for additional info.

fig 1.2 illustrator process 

This is what the landing page looks like:

fig 1.3 landing page design

This is the presentation slides:

Project 2

Our second project was a continuation of our first project. We had to create a website for the landing page that we previously designed.

After finalizing the design, I started working on it on Dreamweaver.

fig 2.1 HTML codes

fig 2.2 css codes
This is the link to the website:

https://fervent-villani-7ef5d7.netlify.app/

Comments

Post a Comment

Popular posts from this blog

Professional Developement Week

-
REFLECTIVE REPORT As this semester is my final semester, it was compulsory for me to attend  6 workshops or webinars during Professional Development Week. All the webinars I attended were very insightful and meaningful, and I learned a lot from them. Here are some of my key takeaways. I joined 3 different webinars on the first day, the first workshop I attended was the " Financial Literacy for Fresh Graduates " workshop by Maybank. This webinar taught me so much, including the budgeting rule, which states that individuals should split their money 50 percent on needs, 30 percent on wants, and 20 percent on financial goals. Furthermore, adhering to a budget plan is critical for tracking spending prior to generating the budget. Maybank also assisted me in gaining a better understanding of some of the elements. The first is Investment Preparation, which entails self-assessment and the creation of emergency reserves while understanding risk tolerance. The second section is Steps ...
Read more

APPLICATION DESIGN II - FINAL PROJECT

-
Image
Week 1 - Week 14 Phoebe Ansel 0340165 Application Design II Final Project  INSTRUCTIONS     Final Project For our project, we had a collaboration with the business school and IT school. We were tasked to create a mobile app for the business school. They wanted to create a virtual fitting room app that would allow users to see how the clothes would fit them virtually so that wouldn't have to try them on. We were first divided into 2 groups to work on the user flow, user journey, and wireframe.  We did our work on miro: We then had a meeting with the business school students and made changes after receiving feedback from them. After doing the user flow and user journey, we started working on our wireframe. The idea was for both teams to create wireframes and then choose and combine them together to create a better version of it. my group's wireframe We had a meeting again with the business students and also showed Mr Razif our work, he then chose which elements ...
Read more

TYPOGRAPHY - FINAL PROJECT

-
Image
30/10/19 - 20/11/19 (Week 10 - Week 13) Phoebe Ansel (0340165) Typography Final Project LECTURES INSTRUCTIONS PROJECT Week 10 For our final project, we were told to create protest placards  about our belief about design and society. We had to bring a 5-7 foot long stick, a A2 size cardboard, some markers or paint, newspaper, and chinese ink. I decided to use the phrase "Design is Empowering, Enlightening, Endless" fig 1.1: sketches for protest card fig 1.2: final design of my protest card  Week 11 This week we were told to create posters by digitalizing our previous protest placards. We were told that the design does not have to be exactly the same. We were also told to use the given typefaces. I created several designs for the poster. fig 1.3: screenshot of my illustrator artboards (initial ideas) Week 12 After showing Mr Vinod and Mr Shamsul the designs, I decided to choose and improve the first poster I created. This is the design I c...
Read more