Interactive Design's Project II
(Week 08 - Week 10)
Fong Ee Xuan (0332842)
Interactive Design
Project II
LECTURE NOTES
LECTURE 07: -
Week 08
(23/05/2019)
We have no lecture this week as we continued our exercise 4 and also we started sketch our layout for Project II.
LECTURE 08: BOOTSTRAP
Week 09
(30/05/2019)
This week, Mr Shamsul and Mr Lun introduced us Bootstrap. It can be apply to our project II if we want.
Figure 1.0: Bootstrap in Adobe Dreamweaver
Figure 1.1: The look of Bootstrap
LECTURE 09: -
Week 10
(06/06/2019)
We don't have lecture on this week due to public holiday.
LECTURE 10:-
Week 11
(13/06/2019)
We don't have lecture on this week but we consult with Mr Lun about our Project II.INSTRUCTIONS
PROJECT II
MICROSITE - THE TROUBLEMAKERS MANIFESTO
Week 08 - Week 10
(23/05/2019 - 06/06/2019)
For this project, we were required to design a microsite that is about "The Troublemakers Manifesto: A Design Colloquium". We have to promote the event through the website.
Here are the content that we have to included:
The Design School,
Taylor’s University
Taylor’s University
The Troublemakers Manifesto: A Design Colloquium
Open Public Lectures:
November 8, 2019
1030–1100 Ms Liew Pik-Svonn
1105–1135 Ms Ezrena Marwan
1140–1210 Mr Muthu Nedumaran
1400–1430 Ms Suzy Sulaiman
1435–1505 YB Ahmad Fahmi Fadzil
1525–1700 Panel discussion
Lecture Theatre 12
Before I start everything, I sketched the layout of the microsite. After that I start thinking about the mood board which have the content, the navigation bar, colour palette, icon, images and also the typefaces.
Figure 2.0: Sketches that I did
Figure 2.1: Moodboard #1
Figure 2.2: Moodboard #2
Figure 2.3: Moodboard #3
Figure 2.4: Moodboard #4
After that, I started do my layout look at Adobe Illustrator.
Figure 2.5: Process of making it on Adobe Illustrator
Figure 2.6: Page #1
Figure 2.7: Page #2
Figure 2.8: Page #3
Figure 2.9: Page #4
Figure 2.10: Page #5
After I finished my layout at Adobe Illustrator, I start doing it on Adobe Dreamweaver. I didn't use bootstrap for this project because I think it's quite complicated to me.
Figure 3.0: Process #1
Figure 3.1: Process #2
Figure 3.2: Process #3
Final Outcome (HTML file)
Final Outcome (CSS file)
Figure 3.3: #Home
Figure 3.4: #About
Figure 3.5: #Event
Figure 3.6: #Shop (1)
Figure 3.7: #Shop (2)
Figure 3.8: #Contact
Final Outcome on Website: https://ecstatic-yalow-afdc72.netlify.com
Comments
Post a Comment