The blog of wonders – A Blog By Alex Hull

April 18, 2016Alexander Hull

Last post before deadline

Here are a few more things that i needed to write about in my blog but i have run out of time to fully explain about what they all do and how i did them so here is a brief description of them all.

In order to do the rollover highlight fir the Achieve greatness page titles i had to use an add on from the free muse widget library on their website. The widget was quite hard to find and i almost had to pay for it but there was a version that was free and i used that one. I think the effect has had a great impact on how much that page stands out compared to the others. This page looks like it could belong to a real website and i feel the others still have a slight amateur tone to them.

Screen Shot 2016-04-22 at 01.03.42

Next is the graphics on the first page, I feel that these graphics add an element of friendliness to the homepage whilst also being informative and taking up space that needed to be filled.

This is a screenshot that just shows how the forms i have made link back to my email and how is et them up. Both forms on my website have been edited to suit the theme and they are not identical on purpose because i wanted the signing up one to stand out on the page as it is the main feature and i wanted the contact form to because just aprt of the information page.

This is a screenshot of the slideshow on the GymScn page. This slideshow wasn’t an original widget form the muse options because i found them to look outdated and not really what i wanted. So i went of a search for a free slideshow alternative that was more up to date and i came across this one. I feel it is a lot better looking. The images on the slideshow were taken in my local gym and were edited to look like the have the GymScn QR codes on them. I feel the colour scheme of the GymScn QR codes looks good on all the machines i edited them to.

Finally a problem that i found was that on the GymScn page the map seemed to mess up the background and made it white whee the page extended. I tried tirelessly to change this but with no avail so in the end i had to give up and keep it in there. if i knew how i would have definitely fixed this in time for the hand in.

April 17, 2016Alexander Hull

Creating the header

This is what the header looks like for my website, It may not be the final design however i do really like the way it looks and it took me a fairly decent amount of time to get it to this stage.

So in order to create this i had to first start with a green rectangle which is the background of the header. Of course this is going to be in my theme colour! After this i tried to place my GymScn logo on top of it, however with the small height of the rectangle the logo was so small that it got lost in the design. So i did some digging and i found that a lot of websites use an added shape in order to fit a circular logo in for instance. So i decided to give this a go, and i found the result was perfect for what i needed, i found it difficult to add a circle in there however. this was because if i imported it as an image it was slightly blurry and very noticeable and i couldn’t find a circular tool in Muse. So in the end i had to create a square and then round off the edges until it looked like a circle. A bit of a long route but i got there in the end!

Next came the headings in the middle, and i knew i wanted three to create some symmetry in the page. This was actually quite easy to do and all i needed to figure out was how to edit each layer with a certain amount of clicks. After working out how many clicks i needed to do to get to the text layer i could then easily edit the font and size and get rid of the original background colour. As mentioned previously i wanted to either add the social media links in each separate page or put them in the master page, i ended up going with the later as i found it suited the theme more, so i used the set of icons that i had create earlier on and linked them up to real web pages of each social media site.

Finally i wanted to add an element of the master that stuck to the corner of the browser, i found this tool to look really good when the background of the button is slightly opaque so that you can see behind but not fully. You can see below what i mean:

The way it sticks to the top corner is a really nice feature because that is a very important page of the whole site, its the page where people sign up and if they don’t find it because theres so much else on the page then i will be losing customers.

April 11, 2016Alexander Hull

Starting to make and edit

So i have started to create some images for my website for certain things that are key to the site such as variations of the GymScn logo to paste in places and small custom logos for things like social media page links. I wanted to make these myself because then i can create a set that completely suit the theme of the site.

GymScn logo variation for site:

2 sets of social media links:

I could have easily gone on the internet and found some small logos that would have suited my theme but i felt making them was the proper way to go about things rather than using someone else’s work on my site.

I am not sure where exactly i would like these logos to go, i know i want the GymScn one to go on the header of each page (which means it will be added the the master page?) And possibly i may add the social media logos in a specific slot thats visible on each page or i may add them in on each page separately to wherever suits that specific page best.

April 7, 2016Alexander Hull

Getting to know muse

Upon starting to handle Muse and creating a site plan i have already found how similar it is to other Adobe applications such as Photoshop with the drag and drop features and the tools which are very similar if not identical in cases.

I have started by creating a site plan with 5 pages, these are: Home, GymScn, Achieve Greatness, Contact and Profile. GymScn will be a page that should feature a map of all the different GymScn locations and should also have some images of the QR codes on some of the machines in a gym to give a representation of what it would look like. The Achieve Greatness page will feature inspirational pictures and some text advertising why GymScn helps you to keep motivated, waste less time and other important feature of the web application.

April 5, 2016Alexander Hull

Starting the website

Firstly i have created my actual website and set up a folder system that i can now put all of my images and other items than need to be imported into the website in one place. This is also where the Muse folder is, this is not only for my organisation but also for the computers organisation as i had heard before that websites tend to run more smoothly with less errors if there is a proper folder system.

Now comes the simple task of actually creating the whole website! I expect this will take up a lot of my time and i will keep checking in here to update bits of info on what is going wrong and right and what i need to change.