Interactive Design Final Project

-


Dayyan Ahmed (0344670)
Interactive Design 
Final project 


For our final project we were to make a complete website consisting of 5 pages.
We were grouped up in teams and had to make a website that our peer wanted , using their references and ideas.

My client 

Johanna Zora Welle
She wanted to make a website to showcase her photography abilities and portfolio. Along with that some information for her contacts and freelance collaborations.

Client Proposal


After looking at her proposal and layouts she sent me the files and images she wanted to use,
along with that I also suggested some ideas to her and I made my first layout.

Layout 1

fig 1.1 About page

fig 1.2 contact page

fig 1.3 home page

fig 1.4 people page

fig 1.5 travel page 

After making the layouts iIshowed them to johanna to get her feedback , she said that she was not a fan of the colour pink and that I should stick to the green she provided or shades of green , along with that she said that the layouts were nice but she preferred the layouts to be like the ones she provided with grid systems and grid images etc.

Overall she said if the lecturer was fine with the layouts she would accept them too.

So I showed them to Mr. Shamsul and observed other layouts in the class as well , most of the feedback led me to the point that I was not using a reference site , so i searched up some good photography websites and re designed my layout .

Layout 2 

fig 1.6 about page layout

fig 1.7 contact page layout

fig 1.8 land page and homepage layout 

fig 1.9 people page layout

fig 2.1 travel page layout 

For my new layout I studied multiple photography websites and found most of them showcased their work in almost all aspects of their pages like the background and stuff. And the layouts were very simple and clean 

So here I all of johanna's work as the background and images , with enlarge grid systems and a simple nav bar with a logo I made  , after this i was running low on time so i quickly moved to coding adding changes simultaneously.

Home page html

fig 2.2 Home page html

Home page css
fig 2.3 Home page css

Travel page html 

fig 2.4 travel page html

Travel page css

fig 2.5 travel css

People page html 

fig 2.6 people html
People page css

fig 2.7 people css

Contact page html

fig 2.8 contact html

Contact css


fig 2.9 contact css

About page html

fig 3.1 about html

About css

fig 3.1 about css

Final browser view

fig 3.2 browser view  (Scorable)

fig 3.3 browser view 

fig 3.4 browser view

fig 3.5 browser view ( All images are hover enlarge and click as well)

fig 3.6 browser view ( All images are hover enlarge and click as well)


Click image to go to website 

Similarly to my project 2 I have the files here in the link below if there is anyone to use as a template or having problems with the site files.


Popular posts from this blog

Design Research Dissertation - Final Compilation and reflection

-
Image
  Dayyan Ahmed - 0344670 Design research dissertation  Final Compilation and reflection Instructions Dissertation Turnitin report  Research article for publication  Reflections Out of all the things we learned this semester for me the three key elements would be. First, summarizing text. My way of writing is often very descriptive however in this module we were going the other way and decreasing words which was pretty annoying in the beginning but then I caught up pretty good. Identifying key words and to the point descriptions easily let me decrease my text at the same time keeping the relevant content. Secondly, I think I have been going through this since i started university. Organization , the importance of organizing your work flow is extremely important especially when you have the pressure of four other modules. If I was to follow my old work flow I probably would be dead but i kept my work flow pretty organized this time and ev...
Read more

Major project - Final compilation and reflection

-
Image
  Dayyan Ahmed 0344670 Bachelor's of Design Creative Media Major Project Final compilation and reflection Instructions Project Breif  Our breif for our major project was pretty straightforward we had to find a real life problem and produce a real life solution for it through our project. After which we provide a proposal to be accepted. at the end of the semester we were to present our projects in an exhibition. My choice of topic was "binaural beats as an aid in drug recovery" related to the sdg of drug abuse and solutions Proposal : So my chosen project was countering the problem of increasing drug relapse in rehab centres due to doctors not having a solution to help their patients in recovery. My solution was to run a campaign about an effective solution that doctors can use to help their patients to decrease relapse which was binaural beats. The topic of drug recovery is also personal to me as i have faced this same problem while going through recovery and the doc...
Read more

Creative brand strategy - project 3 content conversion and statistics

-
Image
Creative brand strategy  project 3 Dayyan Ahmed (0344670) Content conversion and statistics Instructions Task brief  For project 3 we were told to compile all our content and then analyze and compare which posts had the highest conversion rate. what type of posted they were and how well did they work through the campaign Final compilation and statistics presentation Feedback  - Slides were a bit too statistic based - Could make more room to show more content  Reflection The final project here helped me understand how different content interacts with an audience. During the comparison i could point out which type of content was above others and a more better approach when running a specific campaign.
Read more