Following the wireframe designs I completed earlier in the month, I have settled on a final design for my portfolio:
Homepage
Blog
Portfolio
Site Structure
In addition, I have also produced a site structure diagram, showing the basic technical layout of the website:
Assets List
As part of the process I have also produced an Assets list, which provides the relevent copyright information for resources (such as typefaces) that are used in the design. The Assets List can be found here.
For our third task, we have been asked to produce some initial screen designs for our portfolio. At this stage, I haven’t quite come to a decision on what kind of identity I want to go with, so I decided it would be a better exercise to focus on the information architecture of the website rather than the design itself.
Homepage
The main focus of the page will be examples of my work, which are prominently featured using an image slider at the top of the page. The user will be able to manually cycle through the slides themselves using the dots below the image.
The sidebar features my latest blog post, as well as the latest tweet from my twitter account, with a link underneath to follow me.
The content area on the left will contain some information about me, my background and my skills.
Portfolio
My portfolio page will contain examples of my work from throughout my time on the course. Each will contain a small preview image of the work I did as well as the name of the client and the skills I used during the project. The whole box will be clickable and once clicked will take the user to a page with more information about the project in question.
Blog
My blog page contains the latest entry in full in the main content area. Underneath this are links to the other five latest entries. On the right, there are archive and category links.
Word Count: 251
Delivery Requirements
The delivery requirements for PPD4 will be as follows: • A portfolio website, built using WordPress and valid XHTML and CSS • A set of final screen designs • A site structure diagram • An assets list
Competitive Analysis
As part of the process of producing my portfolio, it is important to take a look at the competition I will be facing within the industry, assessing both their strengths and weaknesses, so that I can gain an idea of what I should be aiming to produce at the end of the module.
Specifically, I decided to look at freelancing individuals. Here are a few of my local competitors (specifically the Wakefield area):
Fresh4design (Tom Coad) – fresh4design.com
A very strong portfolio with a good range of skills on display. It is clean, aesthetically pleasing and well designed. It also features an option to download a CV and VCard, as well as many ways to get in touch. The site is also, crucially, ranked number one on google for the search term ‘Web Design Wakefield’.
Mark Till Online – mark-till-online.co.uk
A clean portfolio with good information architecture. Displays a good range of skills and has a strong portfolio.
Timothy Stringer – timothy-stringer.co.uk
A former student of FdA Web Design, Tim’s portfolio is clean and nicely designed.
Jarnail Singh – jarnailsingh.co.uk
Although there are a decent range of skills offered, the portfolio itself is fairly poorly designed and lacks impact.
Wayne Ambler – wayneambler.co.uk
The portfolio is fairly well designed, and he has a wide range of skills. However, the site is fairly slow to load and lacks impact.
Rather than just look at the local market, I decided to look internationally as well, using some of the well-known inspiration websites. Here are a few notable examples:
Jeff Sarmiento – jeffsarmiento.com
Jeff Sarmiento’s portfolio has an extremely eye-catching and unique design. It also features a fair range of work. However, he is fairly vague about the skills he possesses.
Jason Reed – jasonreedwebdesign.com
Jason Reed’s site features a prominent illustration which draws attention very effectively. The layout is clean and it has good user interaction. He also provides good detail about his skill set.
Mike Precious – mikeprecious.com
Mike Precious has a very strong portfolio, featuring a clean, unique design with good typography and good information architecture. It features alot of information about the services he provides and a strong portfolio.
Word Count: 398
For our final assignment we have been set the task of creating both an online portfolio showcasing our work over the past two years, as well as a twenty-minute presentation narrating our journey through the course.
Project Goals
My goals for this project are fairly simple:
To produce an modern and clean portfolio
To further build upon my WordPress skills, using it as the CMS for the portfolio
To give a twenty minute presentation reflecting on my journey throughout the course
Target Audience Profile
My main target audience is an academic one; specifically my tutor Steve Smith and the exam board. The main aim of the portfolio will therefore be to show the progress I have made over the duration of the course; the improvements I have made from the first assignment compared to the current ones should be visually obvious.
Another target audience will be potential clients for freelance work. For this reason the portfolio must also include some details about my skills and what work I could potentially carry out, as well as a way for interested parties to contact me. As part of this, the portfolio will be built in WordPress, not only because this is technically a good system to use for a portfolio, but also because it’s a skill that is in high demand and having my portfolio built in it will further demonstrate that I am capable of implementing it.
Word Count: 240
If the last few weeks are anything to go by; torturously low levels of sleep, dangerously high levels of caffeine, and by resisting the persistent temptation to hurl my laptop into traffic.
The time has come to evaluate PPD3, and I’m not entirely sure where I begin to deconstruct the last few weeks. At last, after a lot of sleepless nights, I have a working image gallery complete with a photo uploader and login system. However, the process of actually building it turned out to be much more difficult than I’d ever imagined.
My mistake, really, was biting off far more than I could actually chew. When I wrote my learning contract, I was full of hopes and aspirations. I had little idea of the difficulty of learning a new programming language, and as a result set the bar very high. I wrote that I would build an image gallery where users could upload their own, and comment on each others images. I may as well have said I’d land an elephant on the Moon; the level of stress that ensued would have been about the same.
I began by reading the Sitepoint book ‘How to Build a Database Driven Website with PHP and MySQL’ by Kevin Yank. I started working my way through the process of building the joke database the book is centered around, but I found the methods used in the book difficult to really absorb. I’m not sure if this is a common issue with tutorials in general, but it felt like I was just repeating orders in a parrot-like fashion; the book would tell me to type something and so I’d type it, but was I really taking in what was being said? It didn’t really feel like I was.
In addition, progress was slow. I managed to get to a stage where I had a working joke database that users could add and delete jokes from, but I seemed to be hitting errors left right and centre. With not long left until the deadline I made the decision to move ahead and begin working on my image gallery.
I decided that the method of learning prescribed in the Sitepoint book simply wasn’t working, and having been told that there were some decent tutorials available online, I decided to give them a go. I came across a tutorial on Sitepoint called ‘Build An Automated PHP Gallery System In Minutes’. ‘Minutes’ probably isn’t really accurate, but it was still a useful guide and by following it through, and reading the discussion pages on the forum, I managed to build a basic photo gallery, with an uploader system. Although the feeling that I was just ‘following orders’ was still there, at least this tutorial was targeted towards my end goal.
I also had to build a login and registration system, so that only registered users could upload images. To do this I found a set of tutorials on About.com that take you through the process of building a secure system, and I actually found this to be a fairly simple task. The difficulty came with integrating the system with my image gallery, and setting up cookies. However, with some persistence I soon figured this out.
Regardless of the outcome of this unit, I am going to go back and delve deeper into PHP, because in all honesty I only feel like I’ve scratched the surface of what is to be learned. I suppose a fair amount of knowledge will come from actually using it day-to-day, however I will go back and possibly read a different book or other tutorials in order to expand my knowledge, without the pressure of time constraints.
Word Count: 627
Hindsight really is a wonderful thing; and this unit has been full of it. Why did I set such a catastrophically large word limit for my first and final entries? And why did I set such an abysmally low limit for my regular entries, a limit that I’ve already been forced to break? Why did I set myself such complex tasks when I knew that I was learning a new programming language and knew that the learning curve would be very high? Why did I fail to properly consider all this when I wrote my learning contract?
My progress with PHP has been slow; slower than I’d ever really anticipated. It still feels like some alien concept that I’m yet to really comprehend; it’s all a bit intimidating. I’ve read a good chunk of the Kevin Yank’s ‘How to Build Your Own Database Driven Website with PHP and MySQL’, but it’s felt a bit like dragging a ton of bricks up a mountain. I find myself, rather than actually learning and absorbing what is being said, simply recieving orders from the pages and carrying them out one after the other. I realised not long ago that I needed to find some other method of learning, one that will see much faster progress. Because the reality; that I have to submit a working photo gallery in a couple of weeks time; weighs very heavily upon my shoulders at the moment.
So the plan is this; I’m going to start researching PHP tutorials online that are actually relevant to my end goal, in this case building a photo gallery. I’ve been informed that there are some very good tutorials out there, and this would seem to suit my learning style more than reading page after page from a book.
Word Count: 301
I’d be lying if I said I’m finding this unit easy. It doesn’t help that time has suddenly become an extremely limited commodity for me this year, but I think a lot of the difficulty stems from my inability to break things down into logical, easy-to-manage steps.
It was the same when I began learning HTML and CSS. I vividly remember the first time I opened a page of HTML, and a myriad of complex elements and tags dribbled down the screen. I remember staring at this intangible web of type with a rather blank expression. I remember thinking it looked as if my computer had vomited. Before I’d even truly begun, the demons of self-doubt had taken their familiar hold; I remember thinking that I am not organised enough, not logical enough, not intelligent enough. I remember thinking I will never be able to do this.
And yet here I am, two years later. HTML and CSS are almost second nature. I still run into issues, and at times CSS frustrates me to the point of wanting to reject all technology, pack my best loincloth, flee to the Savannah and live among the buffalo. But nonetheless, I have made a great deal of progress in those two years.
I need to remember this while trying to scale the rather daunting learning curve of PHP. As complex as echos, strings, variables and arrays seem at this moment, they are not impossible to master. It will take time, patience, determination and hard work; but one day I will be able to do this.
Word Count: 258
I’ve always had a slight issue when it comes to learning new skills; put simply there is an impatient, overexcitable child lurking somewhere inside my brain that simply has no regard for logical thought or process. The first thing it wanted to do as part of this module was to ‘build things’, as if it had been presented with a Meccano set on Christmas Day and decided the instructions were simply not needed. The result, I imagine, would be fairly similar; frustration, tears, and a spattering of broken objects spread out over the bedroom floor.
Thankfully on this occasion, the rational adult in me managed to override the grip of the child, and decided to do things properly.
Luckily, this process turns out to be very simple. There is a program called ‘MAMP’ for MAC, that installs Apache, MySQL and PHP all in one package. After downloading the software, you simply drag the disk image into the applications folder, and open the program. You are then presented with the following:
This means that MAMP has installed successfully and you now have a local server to test PHP on.
And so the child grinned with anticipation.
Word Count: 199
As part of the process of my learning contract, I felt an important aspect would be to first research and understand both PHP and MySQL and their common uses within the industry, and how learning both skills should be approached.
The reason I originally wanted to learn PHP and MySQL, and eventually chose it over the others, was to be able to build dynamic websites and custom build applications for certain requirements, rather than simply modifying a content management system. I found from searching job adverts in my previous entry that this is a skill that many employers value highly and would be very relevant.
However, there are other uses for PHP/MySQL that could prove to be very useful:
Based on this I decided that the most effective way for me to learn PHP/MySQL would be to use a book, website or other resource that is held in high regard within the industry, and then apply the techniques that I learn to produce some kind of project. In keeping with the theme of my WRL2 website, I have decided to produce a simple photo gallery for Astrophotographers. Users will be able to upload photos and other users will be able to view and comment on them. I had originally considered creating some kind of content management system, but having done some research I decided that this might be too complicated for my first project.
Honey and Mumford
When I originally did the Honey and Mumford learning styles questionnaire, I scored as an ‘activist’. Broadly described, activists are people who favour direct action, are enthusiastic and welcome new challenges. I decided to take the test again to see how or if my learning style had changed over the past year, as it could have an impact on how I approach this module. Having took the test again, I discovered that my results are roughly the same. I am still mainly an activist, with a low preference for reflector, and very low preferences for theorist and pragmatist. This means that I need to approach my learning by actively doing tutorials and putting things into practice, rather than theorising too much.
Conclusion
Following the results of my Honey and Mumford test, I feel that the best way to approach learning this module is to follow along with the tutorials in the Sitepoint book ‘Build Your Own Database Driven Website Using PHP and MySQL’ and actively produce the CMS described in the book. I can then use this knowledge to build the system required to produce my Astrophotography website. I feel this method will be suited to my learning style and will allow me to absorb the information much better than if I took a more theoretical approach.
Word Count: 484
For PPD3 we have been given a module known as the ‘learning contract’, for which we have to identify a particular skill that we wish to learn and then produce a contract documenting the process we will follow in order to acquire this skill.
Part of this process is researching skills that would be potentially useful and valid for a future career within the industry. I decided to look at current web development roles that were being advertised and the skills that they asked for, and which out of these they appeared to emphasise the most.
I found a job posting for a Junior Web Developer, which lists the following skills:
Key Skills
• HTML
• CSS
• Photoshop
• Must be able to hand code HTML and CSS not just use a WYSIWIG editor such as Dreamweaver
• Knowledge of web standards
• Attention to detail
Beneficial
• PHP
• MySQL
• Flash
• ASP
• Microsoft Access
Although not considered key skills, it is suggested that both PHP and MySQL skills are highly regarded, as they are at the top of the list. This isn’t the case with all jobs, however. In another job posting, Ruby on Rails and Javascript are listed as essential, rather than PHP. But many developer jobs are now listed as ‘PHP Developer’ or Web/PHP Developer’ which would suggest that knowledge of PHP would give me access to a wider range of jobs.
The three options I am considering for my learning contract are as follows:
PHP/MySQL
PHP is very widely used alongside MySQL to create database-driven websites, and as such would be a very useful skill to know. It is a skill that is highly regarded by potential employers and would give me the knowledge required to create custom-built dynamic websites for clients.
I found quite a few books on the subject but there are two in particular that appear to be held in high regard within the industry, and have recieved overwhelmingly positive reviews from customers. One is called ‘Build your own database driven website’ by Kevin Yank. This book is from Sitepoint, who in my personal experience produce very good, easy to read, practical books. It is written in a tutorial-style format, which I feel could suit me because I am a fairly kinaesthetic learner. The book goes through the whole process, from installing PHP and MySQL on the server, through to actually building your own content management system, which would be a very useful ability to have. It also shows you how to build an ecommerce system.
Alternatively, there is also a book called ‘PHP6 and MySQL5 for Dynamic Websites’, by Larry Ullman. The book has very good reviews, but appears to be written in a more theoretical way than the Sitepoint book, which might not suit my learning style. I generally prefer when learning a new skill to go step-by-step through an actual project as I feel I can absorb the information better when I’m actually putting it into practice. However, the book is longer and appears to go into more detail than the Sitepoint book.
HTML5/CSS3
HTML5 and CSS3 are the next planned revisions to their respective standards and are both currently under development. As these are going to be the next phase of web development it could be useful to be one step ahead of the competition and have prior working knowledge before their full release (currently unknown).
There are two video-based courses on Sitepoint known as ‘HTML5 Live’ and ‘CSS3 Live’, that provide step-by-step lessons and a forum where you can talk to fellow students and seek help if needs be. However it is difficult to find reliable reviews of the course as it’s section on the website oddly doesn’t have that section, so I can’t be sure of the quality of the course.
Alternatively, I found a book named Introducing HTML5 by Bruce Lawson and Remy Sharp, that has good reviews on Amazon (although as it is a fairly new book it has only eight reviews at the time of writing). However it doesn’t appear to utilise tutorial-style learning like the Sitepoint course does, and this may make it incompatable with my own personal style.
jQuery
jQuery is an open-source Javascript library that has gained popularity and can be used to help navigate webpages, handle events, add animation, and potentially implement AJAX applications. It drastically reduces the amount of code normally required to implement Javascript, and it may be a better next step than PHP because it is designed to coexist with HTML and would complement the skills I already have.
There is a Sitepoint book that covers jQuery known as ‘jQuery: Novice to Ninja’ by Earle Castledine & Craig Sharkie. The book has recieved good customer reviews but there appear to be better books available elsewhere, such as ‘jQuery in Action’ by Bear Bibeault and Yehuda Katz. It has recieved very positive reviews on Amazon and uses ‘lab pages’ that teach you each technique using a practical example, so I feel this book would be better suited to me than the Sitepoint book.
Conclusion
Although I feel HTML5/CSS3 and jQuery would be good skills to have, I feel that learning PHP and MySQL is the logical next step in terms of my progression. I would like to be able to create database-driven websites as this would make me far more employable and would be a great thing to be able to add to my CV.
HTML5/CSS3 may be something I will learn closer to their respective release dates, but as they are not current technologies I feel it would be better to learn something I can begin to implement in my work immediately.
jQuery would be good purely to complement my knowledge of HTML and CSS, but it simply isn’t as high of a priority as PHP/MySQL at the moment, which I feel will be of higher importance to both potential employers and clients.
Word Count: 1002
