The second year feels like it has flow by, even quicker than the first! And soon we will be in out third.
A few words for Web.. (Print will be following in a separate post)
Upon returning to second year I felt much more confident with web than in the first year. The first year was very general and over the summer I played around a lot with InDesign, which really showed when I came back for the second year. Early on in the year I worked with Hannah and Jules, with some refresher sessions including working on InDesign, and then onto Web as the first of my two chosen areas. I opted for print for the second semester but I’ll get to that later.
The first few weeks of web were fabulous! I really enjoyed the tuition from Jules and Jason and felt that Jason was very good at explaining and didn’t rush at all. In fact in lessons I kept up much more than I ever did in the first year. I found the html to be interesting and pretty straight forward. (In class that is!) I enjoyed leaning about wireframing and learning the process of web design.
When I began to code my own site, I quickly hit big learning bumps so to speak! I realised my initial design was rather more complicated, making it much harder than it had to be to complete my site. I decided I would redesign the site in to something that made more ‘sense’ and go back to basics. So I put my web on hold a while and I thought about ways around it. I found it fascinating how web works as I have often wondered, and now, I have understanding of how pages work, how simple things like hovering to click, the button changes and all the little details that make up a web page. I often feel that when I know how something is structured, I begin to understand it. For some reason I learn best when I know the logic to something, and this is certainly the case with web! At one point I worried that it was beyond me. But it isn’t. And I got there. I went back to the beginning and made up a new design, which included text more than the sliced images that I was trying to construct my entire site from. In hindsight there are a few things that I would change but I am really happy to just have it handed in and done. It’s safe to say I prefer playing around on InDesign! In the first year there were many many more ‘beyond me moments’ but it seems that those moments are becoming less and less! I wonder if the third year will prove even better! I think it just might. I completed my web later on in the year and not the start because I didn’t get it finished before the end of the semester 1 so in theory I have worked on bits of it all year! But only completed it right at the end, and actually after the regular deadline as I had been granted a PMC due to a recent operation to remove a tumour in my back. Thankfully the University has the PMC procedure in place when students most need it, granting them some extra time when they have is reason for it. Without this I would probably have crumbled and failed. Because after my op on the 26th of February, I was in hospital for a week and then when I eventually got out I couldn’t sit for more than a few minutes without having to stop and move or lie down.
Web in the second year was a very valuable learning curve and it did exactly what I suppose the module is in place for- to learn and know better for the future. I’m not exactly sure what we have to do for third year, I heard it was only one area and the way I feel at the moment, I would absolutely love to develop my skills in designing booklets, leaflets and other things using inDesign, but I don’t feel particularly confident in struggling with web all over again! So I will make sure I speak to my tutors about this before making any big decisions in third year for pathways.
This is a video demo of how my website looks and how it functions as a whole.
FINAL WEBSITE PAGES
These are the final web pages of my website. Although I did struggle with certain elements of my site such as the coding process and understanding how scripts work, I was able to complete a full functioning portfolio website. It isn’t the most complex of designs by any means, or the fanciest. But for where i am at right now, i am happy with it!
Portfolio Page Coding
I was able to code and develop the carousel from http://www.bkosborne.com/jquery-waterwheel-carousel on to my portfolio page. It was quite an easy process as I was following a tutorial but I think this best showcases my work in an interesting way, as mentioned below..
This is a corousel viewer, I plan on developing this in to my portfoli page by following the tutorial over at: http://www.bkosborne.com/jquery-waterwheel-carousel
It has to be an improvement from my shambles of a last attempt. The sliced images looked bad all next to each other just thrown together on one page. This separates and helps the eye focus on each individual piece!
I have done some research and I’ve come across alot of portfolio viewers and I think this is something that will work best for my website: http://www.bkosborne.com/jquery-waterwheel-carousel
CONTACT DESIGN CODING
This is the development of my contact page following the layout of the about me page. What I did here was have my social links on the right side and a contact form on the left.
I was able to get a free contact html from: http://www.freecontactform.com/download.php
Once I downloaded the files, I copied and pasted the code in to my website. This is REALLY helpful for someone like me that isn’t the best on web!!
ABOUT DESIGN - CODING
This is the about coding design of my website, I will carry this same 2 column layout on to the contact page.
HOMEPAGE DESIGN - CODING HTML
Although I’m new to coding and I keep getting online help on how to do certain things, it really does help. Especially with the PMC extra week. Lifesaver.
I realised that I used a custom font and after some time of research on how I could use this on my website, I came across some useful information that lead me to a website called Font Squirrel, which I can use to upload the font I used and it will convert them in to a web font. Usually i download off dafont so this was nice to use for a change.
Font squirrel was able to generate and provide a code that I was able to paste in to my stylesheet and start using the font for my website.
The first part of my coding. It is very time consuming but it is a start. I actually enjoy it when it goes right!! As i have said earlier on here somewhere, i actually learned coding when i was a lot younger because you had to code on an online game called horse world YEARS ago, and then it was much harder because it didn’t automatically finish parts off for you, like it does now. I found the first design also made it harder because i didn’t realise what it all meant to put it all together. This time i have a better idea.
As for now I’m going to have this a blank canvas, I am undecided between a slideshow of my work or possibly thumbnails that I could click on and they will open a different page for a full view or maybe a pop up box. On my initial design i used sliced images which i attempted to code normally but i found them to be all different sizes and they looked bad on the page. I have always liked the idea of a slideshow, i always think they look tidy, and usually give off a more professional feel when on a web site.
The blog link in the navigation of my website will link to my tumblr. I wanted to add another link to my original plan because i think it looks better and its supposedly quite easy to do as its just a link.