Interactive Design : Exercises / Week 01 - 07
Interactive Design GCD60904
NAME: Sea Hirayama
I.D: 0347596
COURSE: Bachelor of Design in Creative Media / Taylor's Design School
●Instructions
●Lectures
Week 01 (29/03/2022) :
For first class, we are introduced about this module, interactive
design with MIB. Shortly we learned about HTML, CSS and difference
between internet and website as well.
Week 02 (05/04/2022) :
After we learned about week01's lecture more, we did fundamental
HTML with studying details. Also we were required to download
Adobe Dreamweaver to create own website. And "Netlify", too.
Week 03 (12/04/2022) :
Week 04 (19/04/2022) :
We learned about UIUX, after that we required to explore skill, code
for CSS as new.
It's not you. Bad doors are everywhere.
Week 05 (26/04/2022) :
For this week, we were given recording lecture as well.
Also we learned how to put the image as background, text background and shadow.
Week 06 (03/05/2022) :
No lecture for this week.
Week 07 (10/05/2022) :
We learned how to compose with boxes in CSS. In the class, we did exercise to create it. It's kind of difficult and confusing for me to make sure as well. I have to catch up with this.....
●Exercises
Week 01 (29/03/2022):
-Surveying the Possibilities
After you have completed the task, upload the excel sheet into your Google Drive and share the link in the comment section.
After you have completed the task, upload the excel sheet into your Google Drive and share the link in the comment section.
For my link :
Good Website
Yeti Pictures : https://yetimotion.com/
Explain Design Pros/Cons :
• This website shows interactive visual elements and make you so fun to see the options. Also the black color background makes pictures comfortable to see, it doesn't show messy.
• The emphasize of images tell us what is the project for clearly. • Type face is simple which gives us clear to see and select with cursor. • The element's color is shows clear to see as well.
Target Audience :
Agencies and direct clients: furthermore they experienced team can manage any stage of production.
What is the Goal of the Website :
For the project as a chance to “leave our footprint” and explore unique motion design techniques.
Explain Purpose of the Website :
Yeti Pictures is a team of designers/directors with focus in motion graphics, 3D animation and art direction for exploring unique motion design techniques.
Jonas Pelzer : https://jonaspelzer.com/
Explain Design Pros/Cons :
• This website shows interactive visual elements and make you so fun to see the • This bold font gives us more interactive.
• The space, blank of background makes it balance clear and simple without any difficult elements • When you select some project page that doesn't make new tab, isn't annoying.
Target Audience :
The people who wants some design work such as font and web site design
What is the Goal of the Website :
To express and produce his art work and get the client to work with
Explain Purpose of the Website :
To show what his art, design is and get communication with customer in order to create new.
Ocitocine : https://ocitocine.com/projects/
Explain Design Pros/Cons :
• This website has a lot of details and elements but it doesn't give us confuse. • The blank space make it simple and easy to understand as well • The color scheme gives us comfortable and being relaxed.
Target Audience :
The people who wants highlight their products, services, content.
What is the Goal of the Website :
To support client in the deployment of ambitious and thoughtful strategic choices.
Explain Purpose of the Website :
To make customer identity remarkable, long-lasting and original, on screen as elsewhere.
Bad Website
Studio DOT :
https://www.studio-dot.fr/expertises.
Explain Design Pros/Cons :
• The design of showing interesting images and projects are cool but its gives us a bit confused to look for. • The cursor shows unseen and feels us difficult to move it.
• Including the size of text, express a bit complex.
Target Audience :
People who wants to develop and improve their company, its image.
What is the Goal of the Website :
To create a brand identity for costomer, develop it, edit videos and much more to achieve relevant and impactful communication on all the media on which costoms wish to develop.
Explain Purpose of the Website :
To challenge and do not hesitate to push their limits to surprise customs and help customers achieve customs business objectives.
Maximane Lafreniere : https://maximelafreniere.com/
Explain Design Pros/Cons :
• The balance between text and blank doesn't shows interesting and comfortable to see.
• The information is needed more to inform us clearly. • Text alignment and type face doesn't look pleased.
Target Audience :
People who wants know who he is for designer
What is the Goal of the Website :
To express and produce his art work and get the client to work with
Explain Purpose of the Website :
To show what his art, design is and get communication with customer in order to create new
Dddkit : https://dddkit.com/
Explain Design Pros/Cons :
• The size of text and elements doesn't look easy.
• It can increase more blank space to show it clearly.
• The typeface is interesting and unique but it is too much.
Target Audience :
People who wants 3D illustrations that will help give context to their content.
What is the Goal of the Website :
To get the client who use it and spread it
Explain Purpose of the Website :
To provide high level 3D illustration for designers and creators.
Week 02 (05/04/2022) :
-We are required to create a web document based on the content given. Follow exactly the format
as in the document (Heading, Sub-Heading, Paragraph, list,
including links). For a start, you need to create the document
using Text Edit or Note Pad as shown in class. Remember to name the file
as index.html and save the file in a folder name Exercise One. After you have completed the task, you are required to upload
the web document to a web hosting (Netlify).
The document (Heading, Sub-Heading, Paragraph, list, including
links) :
"Netlify" to host own webpages after the class. :
For this task, I tried to learn again with recorded lecture. I
could figure out about HTML as well. I really enjoyed it.
Figure 1-1 : The process of doing exercise
(09/04/2022)
Figure 1-2 : The process of checking the exercise
(09/04/2022)
For the link :
Week 03 (12/04/2022) :
Download the content in the link. You are required to
create a single html page that contains the content
given. You should also include images for required
sections (use all the images provided). In each main
sections, you need to include an id attribute that will
be later used as an anchor to be linked from the
navigation (in the first part of the content).
After completing the task, upload it to Netlify and submit the link in Google Classroom. Complete the task by next week (Week 4).
After completing the task, upload it to Netlify and submit the link in Google Classroom. Complete the task by next week (Week 4).
I could learn how to make list, guide line and combine
them. Also I knew how to put type color on.
Figure 2-1 : The process of trying make list
(15/04/2022)
Figure 2-2 : The screenshot of code for type color
(15/04/2022)
For website I made for this exercise 02:
Week 04–06 (19/04/2022–03/05/2022) :
For these week, I tried to explore the knowledge of CSS. Such as how to put on text shadow, create background with image and put the background box on sentences.
Week 07 (10/05/2022) :
–Layout Exercise
We are required to create a single web page based on the content given in the link. You must follow the layout as in the reference given. Use an external CSS file to create the layout as shown in class. Upload the completed work in netlify and submit the link in Google Classroom.
●Feedback
Week 01 :
General feedback
For this week, we were required to know what is
Interactive Design with MIB. Also, we could
learn a bit about HTML, CSS and so on. To add,
for this week exercise, we had to compare with
good website and bad website with report. It was
really good opportunity for me to understand
about the relation between website and internet
as well.
Week 02 :
General feedback
We create own profile with HTML in this
class. It made me a bit confusing, but I
enjoyed it as well. There were a lot of
information for fundamental HTML as well. I
realized that I have to learn this module a
lot than other because it is really
difficult for me to make sure in
English....anyway, I look forward to explore
my skill.
Week 03 :
General feedback
We learned how to put image on website. It
shows us clear with editing in design mode.
Also, we could know how to combine between
the list and a part of website such as
topic.
Week 04 :
General feedback
We learned what is UIUX and relation between it and html, CSS. It's kind of difficult for me to make sense, but I just realized the importance of the knowledge for creating website.
Week 05–06 :
General feedback
For these week, we're given recording lecture and new thing to do it in CSS. It's also really interesting for me to compose the website by myself.
Week 07 :
General feedback
We learned how to compose them with column skills. Also I realized how difficult it is as well. I just felt nervous to do project for final task.....
●Reflections
>Experience
From these weeks, I could know about html and CSS. It was first time for me to learn and create it by myself that is why it was really difficult for me to do it clearly. But also I could enjoyed thinking about own website. I supposed that someday I would like to open the website as business with my design.
>Observations
There is various web design that is why I have came up with it as well but I noticed that I couldn't express it with my skills of html and css. I supposed that I have to learn more and more.
>Findings
Only one thing that I can say is all thing of html and CSS. Everything was new thing for me to do. Therefore I found a lots of html and CSS.
>Further readings/references
Comments
Post a Comment