top of page

DESIGN.

20+hrs

Create the Website

Create a section on the website for my final project brochure, and the tech review.

Learn the Interface

Get to know the interface. It is very different to any I'm used to so this took a bit of time with tutorials.

 Main Learning Objectives

Editor X

Practice Pages

To begin with, I created the home page to get a feel for it. I started by setting up a grid and attaching images to this to show off some of the main projects I had worked on. I also used a new feature called interactions, which allows you to add hover interactions to certain parts of the webpage. Currently, it seems like it's been overcomplicated as it took a long time to use even with tutorials. 

Learning the Basics

To learn the basics, I used trial and error, as well as tutorials from the Editor X YouTube channel. I learnt about general features, but more specifically getting used to grids and layouters. These are key to creating a seamless website between different breakpoints/screen sizes. 

 This part took me the longest to learn and is something I'm still getting used to and making mistakes with. However, I have improved a lot from the start.

 My Learning Journey

Learn the Interface

1.

Goal Achieved?

Yes. I managed to create a fairly advanced page, with some imperfections that can be ironed out.

Final Results

I ended up with a nice looking homepage on the website. However, it has not been optimised for multiple breakpoints as well as my newer pages. The hover interactions ended up looking really cool and added a dynamic element to the page. Below shows the process making this page.

Key Insights/findings

  • Using layouts and grids is key to a good website

  • It is free to use until you need to add more space for photos/videos or want your own custom domain

User Experience

To make the technologies quicker to navigate, I added next and previous button to each tech which prevented the need to navigate out of each tech to the previous page. 

I also used reveal animations to draw attention to certain parts as you scroll the website. This was also done in my brochure to add a more dynamic element. 

Adding & Duplicating

To show the technologies I had been learning about, I wanted to make it as organised as possible. I created the first page as perfectly as I could, which I could then duplicate and slightly edit for each different technology. However, this all took a long time still and required lots of tweaking after. 

It also meant when I made some changes it caused errors in the website that made it less optimised for different breakpoints. I tried to find tutorials to help with this but as this is fairly new, it is more limited. 

Creating the  Full Website

2.

Learning Sources

Goal Achieved?

Yes. A website was successfully created with minimal errors. (hopefully)

Final Results

I'm happy with the final result of the whole website. However, there is still lots of room for improvement, especially with breakpoint optimisation and efficiency when creating the pages. 

Key Insights/findings

  • This takes a long time to make it work perfectly and it needs constant practice

  • Duplicating pages is perfect when you're trying to keep a theme

Learning Sources

NEXT TECH

PREVIOUS TECH

NEXT TECH

PREVIOUS TECH

Trial & Error

Especially with the SSD replacement, it took a lot of trial and error as there was no specific tutorial for the situation I was in.

Youtube Tutorials

Youtube had the best range of tutorials for this.

​

 Learning Strategy

bottom of page