Tools Used:
- Sketch
- Paper by FiftyThree
- HTML, CSS, Javascript
Problem:
The goal was to have a digital portfolio consisting of personal and school projects to include in my resume. I wanted to design and develop my own website instead of using Bootstrap to practice wireframing and apply the HTML and CSS I had been learning.
Solution:
A minimalistic portfolio website that showcased the projects in my portfolio and interest in design.
Implementation:
I created a multiple wireframes of different landing pages using the Paper iOS app to help decide on how I wanted users to interact with my site and before making mockups in Sketch. In order to stand out from the other single page, continuous scroll websites I had seen, I used Javascript to change the content of the different "pages" when each button was pressed. To further enforce the minimalistic personal branding I was looking to have, I designed my own logo and icons using Sketch.
Images from top to bottom:
1. Final website design landing page
2. Final website design "About" page
3. Wireframe of final design made using Paper
4. Mockup of an alternate design made using Sketch
Tools Used:
- Sketch
- Paper by FiftyThree
- HTML, CSS, Javascript
Problem:
The goal was to have a digital portfolio consisting of personal and school projects to include in my resume. I wanted to design and develop my own website instead of using Bootstrap to practice wireframing and apply the HTML and CSS I had been learning.
Solution:
A minimalistic portfolio website that showcased the projects in my portfolio and interest in design.
Website landing page
Implementation:
I created a multiple wireframes of different landing pages using the Paper iOS app to help decide on how I wanted users to interact with my site and before making mockups in Sketch. In order to stand out from the other single page, continuous scroll websites I had seen, I used Javascript to change the content of the different "pages" when each button was pressed. To further enforce the minimalistic personal branding I was looking to have, I designed my own logo and icons using Sketch.
Wireframe made using Paper (left) and "About" page mockup made using Sketch (right)
Mockup of an alternate design made using Sketch
