MF Photos

This is a basic and minimialist portfolio website to showcase my own photographic work. The purpose is for the user to be able to get a sample of photographic work, learn about the photographer in the "About Me" and then contact the photographer through the contact form.

Live Webste: https://7-deuce.github.io/index.html

UX

I went for a minimalist design, as the product and main focus should be the photographic work. The website should be a blank canvas, not influencing the work but complimenting it in the most neutral way possible. I chose a clean light colour palette with light grey text to help emphasise the colour in the images.

The website is for anyone interested in viewing photographic work (not confined to the limitations of Facebook compression and Instagram) with the option of following on social media or contacting me directly.

Inspiration for this website menu structure is from 2 Wordpress websites I own and manage:

www.kapturelab.com
www.vastwavedigital.com

The familiarty and lack of clutter should help the user to navigate to their desired destination. The navbar remains the same in all pages, operating from left to right. If the user is done browsing the gallery, the next option is About and should the images and about be of interest to the user they can make contact. At all times there are social media links displayed in the footer providing the user with multiple options to contact or choose appropriate social media platform.

https://github.com/7-Deuce/milestone_1/tree/master/wireframes

Main Features

Gallery

The galley allows the user to click on images so they enlarge. This allows the user to see the images larger, and continue to see the images larger whilest navigating through the images.Contact

The contact form allows the user to contact the photographe by inputting their details in the contact fields.

Features for the future

Blog

A blog page would be ideal to implement for organic SEO. I know Google looks for original content and frequency of content when calculating the website's SEO score.

Subscribe box

Implementing a subsribe box will be fundamental to developing the website's marketing functionality. The purpose would be to collect user emails and have an API like MailChimp or SendInBlue assist with managing and storing emails for email marketing.

Call to actions

Having a call-to-action on each page will also guide the user through the websire and ultimately the sales funnel. "Subsrcribe now" "Contact us" are some of the call to actions that spring to mind.

Ecommerce

A webstore to sell prints or an API for Printful so users can buy prints on merchandise in a print-on-demand basis would be a future goals.

Technologies Used

Project Management Tools

Balsamiq - for my wirframes

GitPod IDE - as my IDE to code the website

GitHub - to deploy the website

GitHubPages - to host the website

HTML & CSS

BootstrapFor a responsive site and navbar

Baguette Box - JavaScript for gallery functionality

Font Awesome - Social media icons

JQuery - Navbar

Favicon - Favicon for website icon/tab icon

Code Beautify - Beautify the code

W3C - Code validator

Image Editing

Adobe Photoshop - Image manipulation

Deployment

Credits

https://tutorialzine.com/ - Gallery code

https://bootsnipp.com/snippets/83Br - "Simplest Contact Form" by msurguy

Media

Photos are all my own work.

Ackownledgments

https://www.reddit.com/r/webdev/ - Reddit Webdev community

https://www.youtube.com/channel/UC1WxZFhq56xs1oxXH-XveSQ - Clever Techie

Kraftwerk for the inspiring music!