 |
|---|
| Jack Oswald |
- http://www.jackoswald.dev
- https://github.com/jtrader/portfolio
- https://www.figma.com/file/Q0GS9XX3fIw5XcBCHCZVLpK1/Prototypes
The purpose of my portfolio website is to effectively communicate to potential employers skills and attributes I have in a manner which is clear and concise whilst also visually stimulating. Utilizing design principles such as repitition as well as a strong complimentry color scheme and selected fonts, the site is purpose is to be easy to understand and deliver information which potential employers would be searching for.
The site offers a small level of interaction as the black and white images are transitioned to color on the hover state. Navigation is performed using a circular bar which also provides a description of the links on hover. A link to contact me is present on all views encouraging potential employers to reach out via a contact form. The user has to option of using the navigation bar or simply scrolling down.
This sitemap illustrates the different sections of my portfolio website.
My primary target audience is potential employers, site aims to illustrate profieciency in design, CSS and HTML by example. It also appeals to potential employers by listing additional technologies that potential employers would be looking for in an future employee.
Technologies used include CSS and HTML. In addition the contact form utilizes a third-party app called formspree.io. A few additional programs were used in the design process this included Figma, Moodzer and Pixlr.
The design of the website is heavily influenced by circular avatars websites around the world have welcomed as standard when a user registers an account with them, microsoft outlook have recently incorporated them into their email application as you can see from my moodboard below. Using circles as a base for the design I wanted to incorporate the logos of the languages I have learnt, as well as visual representations for education and work experience. I chose opposing colors orange (primary) and blue (complimentry) for my color scheme with a dark subtle background gradient (dark grey). Another influence which is common amongst settings is 'dark mode' of popular applications such as Mac OS, Outlook.com etc I wanted to capture the essence of the mood of these themes and relay that in my design so the target audience could relate to my design.
Here are examples of preliminary wireframes of what I set out to acheive with my designs.
Desktop prototype completed in Figma
iPhone prototype completed in Figma
Having a dark background it was necessary to have white text, the contact me button is presented prominently making it very easy for the target audience to acheive the goal/purpose of the website. Headings and sub-headings are appropriately formatted using h1 and h2 handles and paragraph text is presented in a light grey. I ensured that all information conveyed was displayed as text with complimentry images for effect.
The process was a mixture of both visual and technical experimentation, I started designing the circles in css first to see what visual effects I was able to achieve, I then when to figma to layout and design the prototype before proceeding into html and css again. I felt it was necessary to play with css first to ascertain whether the layout would be acheivable and reponsive to all devices.
Please find below a in-progress screenshot of my trello taskes for the portfolio project.
By the end of 1987 a network (ARPANET) of 20,000 computers were connected but this network was restricted to selected universities and corporations for specific tasks, in 1990 NSFNET officially replaced ARPANET as the backbone of the internet and it's network of half a million computers. In 1993 hyper-text transfer protocol was introduced so users could navigate the internet through browsers one being Netscape navigator which was launched in 1994. In 1995 NSFNET handed over the network to Internet service providers. Although phones lines weren't designed for transmitting data they were used for people to connect to the internet known as dial-up. Later, technologies such as broadband replaced dialup and today wireless technologies such as 5G are looking to replace broadband.
Define and describe the relationship between fundamental aspects of the internet such as: domains, web servers, DNS, and web browsers.
Webservers store the actual files which users retrieve each time a user visits a specific website, the default protocol for displaying these files hyper-text transfer protocol and the standard file is in hyper-text markup language (html). Each webserver has an IP address which is redirected by a domain name server, it basically converts an IP address into a string(domain), ie yourname.com. For example you purchase an address (a domain), you then have to configure that domain on the domain name server to point to your web server. It's like a mail forwarding service. Users can then access the website via a web browser and entering the domain name in the address bar.
Reflect on one aspect of the development of internet technologies and how it has contributed to the world today.
The development of wireless technologies has had a huge impact on how we communicate today, the introduction of social media platforms such as facebook, twitter and instagram coupled with wireless technologies on hand-held devices sees the average 14-24 year old spending upto 2 hours a day on social media, in addition these platforms are able to push important alerts directly to users, ultimately changing the way we communicate with each other. People on social media such as instagram are ultimately photobooking life events through the progression in quality of phone cameras, which are now commonly used for witnessing crimes contibuting to change in the justice system.