Objective
To create an online version of my current CV.
Method
These are the steps I took to complete this:
- Brainstorm ideas and sketch low and high fidelity wireframes
- Break ideas down into different stages for current skill level vs. future skill level
- Choose color pallet using Adobe Kuler Color Wheel
- Custom color pallet - https://kuler.adobe.com/Online-CV-(1)-color-theme-3926340/
- Choose fonts using Google Fonts
- Codystar - https://www.google.com/fonts/specimen/Codystar (used for main heading)
- Droid Sans - https://www.google.com/fonts/specimen/Droid+Sans (used for all sub-headings and text)
- Select free social media icon images and then edit in Photoshop to match color pallet
- Source for icons - http://tinktank.in/free-flat-social-icons/
- Create an infographic and then edit in Photoshop to match color pallet
- I used Piktochart to create my infographic - http://piktochart.com/
- Write HTML for first version of CV in Sublime Text 2
- Write CSS for first version of CV in Sublime Text 2
- Added hover.css (http://ianlunn.github.io/Hover/) for effects on my links
- Added media queries for responsive web design for different screen sizes
End Goal
For the first version of my online CV I would like to achieve the following:
- Clean, easy to read code in both HTML and CSS
- Simple harmonious design
- Use CSS properties correctly to achieve design ideas
- Adding google analytics for tracking site traffic
- GitHub Pages set up with personal URL (www.jadeshearstone.me)
- Use Photoshop to edit images
- Create a responsive page for any screen size
The Future
This is the first version of my online CV and also the first time I have created a web page from scratch and used Photoshop. I am keen to revisit this project in a few weeks to test some new skills.