Wednesday, 10 March 2010
Wednesday, 24 February 2010
Portfolio Initial Screen Designs
These design are yet to be fully completely but it gives you an idea of what I amt trying to achieve. Feel free to leave any feedback.
Wednesday, 10 February 2010
Online Portfolio Goals and Requirements
Website Goals
During the making of the website I must ensure that I use well structured code. This can be assessed by the use of notes within the code.
The code I create must use validated XHTML and CSS throughout. These can both be checked by W3C's online validation tool.
The website must have a clear sense of visible hierarchy. This can be assessed using a small questionnaire regarding the visual appearance of the website.
I aim to design the page for a screen resolution of 1024 x 768. I will do this by using a grid system that will be visible in the early designs.
I aim to make each page of the site less that 80k in size. This is to allow the slower internet connections comfortably open each page. This can be assessed by viewing the file sizes of each page.
I must ensure that I have cross browser compatibility within my coding. This can be tested by viewing the portfolio across a number of popular browsers.
Delivery Requirements
I will require the use of Adobe Photoshop CS4 to develop my initial ideas for a screen design. It will also be used to create my final screen design.
I will also require Adobe InDesign CS4 to present my final screen designs in. This will allow me to easily annotate and place the measurements on the design.
For the coding I will be using Adobe Dreamweaver. This will be used purely for the coding side of things and it will allow me to structure my pages with ease.
I will be using XHTML, CSS and Javascript to create my website. In particular I will be using Top-Up LightBox to display my images as it is a very user friendly application.
When it comes to uploading I will be using a private web hosting service with the aid of Cpanel. These both combine to allow me to upload my portfolio onto the internet.
During the making of the website I must ensure that I use well structured code. This can be assessed by the use of notes within the code.
The code I create must use validated XHTML and CSS throughout. These can both be checked by W3C's online validation tool.
The website must have a clear sense of visible hierarchy. This can be assessed using a small questionnaire regarding the visual appearance of the website.
I aim to design the page for a screen resolution of 1024 x 768. I will do this by using a grid system that will be visible in the early designs.
I aim to make each page of the site less that 80k in size. This is to allow the slower internet connections comfortably open each page. This can be assessed by viewing the file sizes of each page.
I must ensure that I have cross browser compatibility within my coding. This can be tested by viewing the portfolio across a number of popular browsers.
Delivery Requirements
I will require the use of Adobe Photoshop CS4 to develop my initial ideas for a screen design. It will also be used to create my final screen design.
I will also require Adobe InDesign CS4 to present my final screen designs in. This will allow me to easily annotate and place the measurements on the design.
For the coding I will be using Adobe Dreamweaver. This will be used purely for the coding side of things and it will allow me to structure my pages with ease.
I will be using XHTML, CSS and Javascript to create my website. In particular I will be using Top-Up LightBox to display my images as it is a very user friendly application.
When it comes to uploading I will be using a private web hosting service with the aid of Cpanel. These both combine to allow me to upload my portfolio onto the internet.
Wednesday, 3 February 2010
Target Audience Profiles
Target Audience 1 - Tutor and Peers
This audience requires me to follow a distinct set of guidelines. I must be able to portray my work over the full two year course, showing where I started, and where I'm at now. For this particular audience I think it is key to show how I have built as a designer and I must highlight the new skills I have learnt, and how I have put them into practice.
The portfolio must be well thought out in terms of assessment. Although this is something I could take on after college I must also keep in mind that it is an assessed piece of work and must follow the requirements in order to pass the course.
Potentially my peers may be looking at my work for inspiration and as a sign of how far I have come over the course. It is a very good opportunity to show off and gain a good reputation with potential colleagues of the future.
Target Audience 2 - Clients
For a client looking for a designer, the portfolio is the main catch. A well designed portfolio can alter the look of any piece of work. Using samples to cleverly display even the most boring piece of work is very important.
Clients will want to see samples of your work and there is no better way than through the portfolio. They will also want to find out a little about you, so I must portray myself in the best light in order to impress. I need to keep the portfolio strictly professional and incredibly user friendly.
Search Engine Optimisation can also bring in many clients so it is something that should be considered right the way through the build. For the people who stumble across the site, clear contact information needs to be easily accessible.
Target Audience 3 - Employers
This is the key target audience as I look into the future. Employers within the design industry aren't as bothered about paperwork and seeing qualifications, it is down to the quality and style of your designs.
I have found with clients in the past that even if they have no jobs available they will still ask to see a portfolio. This is because a well design portfolio can influence anyone into offering you a job.
The portfolio has to display professionalism, as this is something that all employers look for. It must also highlight my strengths and smooth over my weaknesses, so to give me the greatest chance of employment.
This audience requires me to follow a distinct set of guidelines. I must be able to portray my work over the full two year course, showing where I started, and where I'm at now. For this particular audience I think it is key to show how I have built as a designer and I must highlight the new skills I have learnt, and how I have put them into practice.
The portfolio must be well thought out in terms of assessment. Although this is something I could take on after college I must also keep in mind that it is an assessed piece of work and must follow the requirements in order to pass the course.
Potentially my peers may be looking at my work for inspiration and as a sign of how far I have come over the course. It is a very good opportunity to show off and gain a good reputation with potential colleagues of the future.
Target Audience 2 - Clients
For a client looking for a designer, the portfolio is the main catch. A well designed portfolio can alter the look of any piece of work. Using samples to cleverly display even the most boring piece of work is very important.
Clients will want to see samples of your work and there is no better way than through the portfolio. They will also want to find out a little about you, so I must portray myself in the best light in order to impress. I need to keep the portfolio strictly professional and incredibly user friendly.
Search Engine Optimisation can also bring in many clients so it is something that should be considered right the way through the build. For the people who stumble across the site, clear contact information needs to be easily accessible.
Target Audience 3 - Employers
This is the key target audience as I look into the future. Employers within the design industry aren't as bothered about paperwork and seeing qualifications, it is down to the quality and style of your designs.
I have found with clients in the past that even if they have no jobs available they will still ask to see a portfolio. This is because a well design portfolio can influence anyone into offering you a job.
The portfolio has to display professionalism, as this is something that all employers look for. It must also highlight my strengths and smooth over my weaknesses, so to give me the greatest chance of employment.
Tuesday, 26 January 2010
Competitive Analysis - Professional Portfolio
For this part of the assignment I must conduct a competitive analysis on a professional portfolio. I must sum up the pros and cons of their designs in preparation for the creation of my own. I have chosen to analyse the portfolio of Chris Spooner, who is now an independent freelance designer having participated in a number jobs through his career. His site can be found here.
Homepage
On the homepage you are instantly hit by a very bold image reel. This is great for grabbing the viewers' attention from the start, with a small insight into some of the work he has done. This is definitely going to encourage the viewer to go on throughout the site, learn a little more about you, and sample some more of your work.
Above the image reel is a very subtle neat header design. Both the logo and navigation are very clear, which is vital for the user to be able to navigate around the page.
Use of a very bold heading and subheading text gives you a good sense of hierarchy; important for navigating around each page. The most important information is also all found above the fold which is crucial to increase the chances of viewers continuing through the site.
The paragraphs below the fold line are poorly structured, and make me unsure where to go after reading the first one. This could be solved by dividing the sidebar more from the main content section.
The link to his personal blog is a very good touch on any page. Advertising your own work only increases its views, and your profile. The clever hover image also grabs your attention and makes you more aware of the link.
The footer is very simple and does exactly what it needs to. He could have possibly included a site map, but for a four page site I do not believe this in necessary. The small link saying 'going up?' is a very clever tool. The way in which it takes you to the top of the page is aesthetically pleasing, with one smooth movement.
About Page
The large bulk of textual content is very well structure on this page. The colours are comfortably distinguishable with the dark text on a light background. With a good size font and good line length, the text is easily readable.
Again, the uses of links to his blog are used. Here he has included his second one but it is a great advertisement for his work.
I like the use of the side bar for a small portfolio section. I personally think it is good that he has included the image of himself. It instantly gives you a more personal feel for his work and means you can put him into context.
He has used the section entitled: 'My other homes on the web' to advertise all his online work. This is a great use of links to a variety of different websites he has work on.
Portfolio Page
This is a very clear and precise way of displaying his work. The thumbnails are great for allowing you to quickly preview the work before you click on it. Using thumbnails also allows you to fit plenty on the page. One negative has to be the lack in information on each piece of work. A small piece of writing to describe the work would have helped me to put each piece into context.
Contact Page
This page is also very simple and clear. A good use of PHP for the small feedback form gives the readers simple communication means to him.
The section entitled: 'A few things to keep in mind' gives clear information as far as contacting him and the questions that can be answered upon initial contact. These are great outlines for anyone interested in his work. This is a very profession approach with very clear guidelines as to what he does, what you need to do, and what you should expect. This is something I should definitely take onboard when making my professional portfolio.
General
Some of the language used (especially in the headlines) is not of a professional standard. I know the intention is to be relaxed and reflect some personality, but personally I think a little more professionalism is needed.
Overall the portfolio is very professional looking and does exactly what it needs to without the fuss. It is also very user friendly and I can definitely take many positives from it.
Homepage
On the homepage you are instantly hit by a very bold image reel. This is great for grabbing the viewers' attention from the start, with a small insight into some of the work he has done. This is definitely going to encourage the viewer to go on throughout the site, learn a little more about you, and sample some more of your work.
Above the image reel is a very subtle neat header design. Both the logo and navigation are very clear, which is vital for the user to be able to navigate around the page.
Use of a very bold heading and subheading text gives you a good sense of hierarchy; important for navigating around each page. The most important information is also all found above the fold which is crucial to increase the chances of viewers continuing through the site.
The paragraphs below the fold line are poorly structured, and make me unsure where to go after reading the first one. This could be solved by dividing the sidebar more from the main content section.
The link to his personal blog is a very good touch on any page. Advertising your own work only increases its views, and your profile. The clever hover image also grabs your attention and makes you more aware of the link.
The footer is very simple and does exactly what it needs to. He could have possibly included a site map, but for a four page site I do not believe this in necessary. The small link saying 'going up?' is a very clever tool. The way in which it takes you to the top of the page is aesthetically pleasing, with one smooth movement.
About Page
The large bulk of textual content is very well structure on this page. The colours are comfortably distinguishable with the dark text on a light background. With a good size font and good line length, the text is easily readable.
Again, the uses of links to his blog are used. Here he has included his second one but it is a great advertisement for his work.
I like the use of the side bar for a small portfolio section. I personally think it is good that he has included the image of himself. It instantly gives you a more personal feel for his work and means you can put him into context.
He has used the section entitled: 'My other homes on the web' to advertise all his online work. This is a great use of links to a variety of different websites he has work on.
Portfolio Page
This is a very clear and precise way of displaying his work. The thumbnails are great for allowing you to quickly preview the work before you click on it. Using thumbnails also allows you to fit plenty on the page. One negative has to be the lack in information on each piece of work. A small piece of writing to describe the work would have helped me to put each piece into context.
Contact Page
This page is also very simple and clear. A good use of PHP for the small feedback form gives the readers simple communication means to him.
The section entitled: 'A few things to keep in mind' gives clear information as far as contacting him and the questions that can be answered upon initial contact. These are great outlines for anyone interested in his work. This is a very profession approach with very clear guidelines as to what he does, what you need to do, and what you should expect. This is something I should definitely take onboard when making my professional portfolio.
General
Some of the language used (especially in the headlines) is not of a professional standard. I know the intention is to be relaxed and reflect some personality, but personally I think a little more professionalism is needed.
Overall the portfolio is very professional looking and does exactly what it needs to without the fuss. It is also very user friendly and I can definitely take many positives from it.
Tuesday, 19 January 2010
Competitive Analysis - Student Portfolio
As part of an assignment we had to undertake a competitive analysis of a student's website portfolio. I came across Richard Paul Davidson's online portfolio and decided this would be a good site to base my analysis. Richard is a recently qualified First Class Multimedia (Computer Science) graduate, and his portfolio can be found here.
Initially the portfolio doesn't provide anything to grab my attention. The choice of using black as the main colour makes the site look very dull. The header and footer use very amateurish computer design skills and without an impacting header on the site, I have to wait for the flash player to complete before I know what I am looking at.
The flash player can be used very effectively; however, the use on this homepage actually limits your access to the vital information until the flash cycle has completed. I believe the information should be there in front of you from the start, telling you viewer exactly what they need to know straight away. This is the purpose of a homepage.
From the homepage alone, it is very clear that there is no grid system used and no text alignment. The text is randomly placed around the page, which makes it look very disorganised and unaesthetically pleasing. This becomes more obvious as you view through the different pages, seeing a definite lack of consistency. Also from viewing all the pages it is very apparent that each page uses a different font size which is a direct neglect of basic design principles.
A positive of this website is its navigation. The text is very clear and consistent, making it very user friendly. I like the use of the hover over drop down menu too because it leaves the page uncluttered. It also adds another aspect of interactivity that is well thought out.
I don't think this website has used the footer to its full potential. Crucial information can be placed in there for easy access. Although Copyright is not necessary, it is always worth showing and stating the Copyright holder of the site. Other things such as contact details and sites maps could have been placed in this section.
On the portfolio pages the lack of internal navigation makes it very difficult to navigate through the different projects he has worked on. There is also an issue with coding as the final link for the Tower Hill work, actually links you back to the Empirehouse.biz section. This is a very basic mistake that actually stops you seeing all of his work.
Again, the use of flash is very poor on this page although it is a good concept. As you move your mouse to click on the projects on the right I found the link quickly moving across the page and it became a task just to be able to click the imagery link. This is not a very user friendly idea, as I found it very frustrating. A simple navigation system would have been much more appropriate.
My first impression of the profile page shows very poorly structured content. He has still continued to imbed the content in flash. This means that the content becomes uneditable, and users are unable to highlight it. The page would be much better off if it was pure HTML and CSS.
On more of a typographical note, the line length is far too long for the readers. Having a long line length means your eyes struggle to find where you are in the sentence. The fact that the text is white on a black background also increases the difficulty of registering the words. The line of text that follows under the image is also very unaesthetically pleasing. Despite these things there is a good use of a portrait picture to be able to put a face to the name.
The CV page again has no need to use flash as the content becomes uneditable. The text is made even smaller on here and the line length incredibly long making it very difficult to read. This page should not be fixed in length and should allow the CV to continue down the page. Definitely a good idea to include the PDF and Word documents, as the CV would be unusable otherwise.
The contact page should contain a list of contact details rather than an instant link to outlook express. This means that he is relying on people having an outlook express account set up, whereas this should be an optional means of contact.
Overall, I have struggled to find many positives on this portfolio. The basic rules of design and typography seem to have been neglected throughout. It has done a very good job of highlighting the things I must avoid when creating my portfolio.
Initially the portfolio doesn't provide anything to grab my attention. The choice of using black as the main colour makes the site look very dull. The header and footer use very amateurish computer design skills and without an impacting header on the site, I have to wait for the flash player to complete before I know what I am looking at.
The flash player can be used very effectively; however, the use on this homepage actually limits your access to the vital information until the flash cycle has completed. I believe the information should be there in front of you from the start, telling you viewer exactly what they need to know straight away. This is the purpose of a homepage.
From the homepage alone, it is very clear that there is no grid system used and no text alignment. The text is randomly placed around the page, which makes it look very disorganised and unaesthetically pleasing. This becomes more obvious as you view through the different pages, seeing a definite lack of consistency. Also from viewing all the pages it is very apparent that each page uses a different font size which is a direct neglect of basic design principles.
A positive of this website is its navigation. The text is very clear and consistent, making it very user friendly. I like the use of the hover over drop down menu too because it leaves the page uncluttered. It also adds another aspect of interactivity that is well thought out.
I don't think this website has used the footer to its full potential. Crucial information can be placed in there for easy access. Although Copyright is not necessary, it is always worth showing and stating the Copyright holder of the site. Other things such as contact details and sites maps could have been placed in this section.
On the portfolio pages the lack of internal navigation makes it very difficult to navigate through the different projects he has worked on. There is also an issue with coding as the final link for the Tower Hill work, actually links you back to the Empirehouse.biz section. This is a very basic mistake that actually stops you seeing all of his work.
Again, the use of flash is very poor on this page although it is a good concept. As you move your mouse to click on the projects on the right I found the link quickly moving across the page and it became a task just to be able to click the imagery link. This is not a very user friendly idea, as I found it very frustrating. A simple navigation system would have been much more appropriate.
My first impression of the profile page shows very poorly structured content. He has still continued to imbed the content in flash. This means that the content becomes uneditable, and users are unable to highlight it. The page would be much better off if it was pure HTML and CSS.
On more of a typographical note, the line length is far too long for the readers. Having a long line length means your eyes struggle to find where you are in the sentence. The fact that the text is white on a black background also increases the difficulty of registering the words. The line of text that follows under the image is also very unaesthetically pleasing. Despite these things there is a good use of a portrait picture to be able to put a face to the name.
The CV page again has no need to use flash as the content becomes uneditable. The text is made even smaller on here and the line length incredibly long making it very difficult to read. This page should not be fixed in length and should allow the CV to continue down the page. Definitely a good idea to include the PDF and Word documents, as the CV would be unusable otherwise.
The contact page should contain a list of contact details rather than an instant link to outlook express. This means that he is relying on people having an outlook express account set up, whereas this should be an optional means of contact.
Overall, I have struggled to find many positives on this portfolio. The basic rules of design and typography seem to have been neglected throughout. It has done a very good job of highlighting the things I must avoid when creating my portfolio.
Monday, 23 November 2009
On Top and Motivated
It has been quite a busy last two weeks with the start of two new assignments. The first task of which, I really wasn’t looking forward to. The concept of writing an article about a design icon seemed fairly interesting to me.
This was until I discovered my allocated icon to be The Beatles album cover, Sgt Pepper’s Lonely Heart Club Band. It didn’t look good as I had never seen this album cover in my life, and have strong opinions on how shocking their music is. I did, however, get a little more into the work, forgetting about my original views. It became an interesting task to review the history of a 'considered' icon and to discover how designs can be iconic.
The next task was to design for a random object. I knew many people would struggle but this has been very enjoyable for me as I thought it would be. I am still doing this now and ideas keep flowing and it has been a really good experience just to spend time being creative. I have learnt a lot about how to get my brain into a design mode, and not to dismiss ideas but draw anything that comes to your head.
Overall, I am happy with how these assignments are going. After an initial rush I feel like I am on top of my work but I know I can't be complacent and I need to well motivated from now on.
Subscribe to:
Posts (Atom)
