Evaluation

Overall i am happy with the final website i created, as well as the unit. I have manged to be able to create different websites in different formats and generate new ideas for my own. By exending my knowledge through individual experimentation i think that i have shown a good understanding of website technology and design.

I think that my website is a good starting point for an online portfolio for myself. I will admit that it needs some work and i would not be hapy to make it an officail website because i would wish to develop some areas more.

One way which i am pleased is that way i have encororated some small elements of interactivity into it. For example i think the way i have created the buttons is good. By creating a simple rollover image i think that it makes the design better. It is visually nicce when the button lights up when you are over it. I have seen this on many websites and think that it is a good idea to know when you have highlighted the button. I also like the way that i have linked the website to others. For example the twitter youtueb and facebook links, i think, make it look slighlty more serious and professtional which is what i am going for.

Things whic i would add or change include some sort of notification to know what page you are on. One way which i would do this woud be to keep the button highlighted when you are on that page. I have seen this on other websites when doing research and think it would be a good addition. Another way which i would improve the website is to shrink the size of the content. I was thinking that if i decreased the scale of my content i could fit more on there. Also i think this idea would compliment the design making it look more professtional. I would need to change parts of the photos page aswell. The thumbnails are not all the same size making it look a bit un finished. Also i want to take the border out of the table that they are in and add more additional information about the drawings/photos in the pop up windows.

Overall i am happy with the outcome of my website and this unti. I feel that i have worked hard and have expanded greatly in some areas. However, if there was more time for me to spend on things like, experimentation and the final website, i would go ahead and make the changes that i have stated above.

Main Website

This is my main website. This is th home page or index page. This just gives a brief overview of my website stating that it is a prototype for my online portfolio. I thought it was important to have a banner on my website becasue it is consistant throught my research on other websites. I have also provided links to other websites that are assoiated with me for example facbook and twitter and also YouTube which is on the videos page. I thought i would put these links on becasue it seemsto be that other digital artists have the same thing. This may be to broaden there online presene and hopefully become more famous in their proffesstion.

 This si the photo section of my website and consist of some of my favourite digital art. I have encorporated a behaviour in all of the photos that allows you to click on them and see a full size image of the same photo in a new window. The reason that i have done this is because you cannot appretiate the full quality of the picture in the thmbnail. It also allow for better quailty downloads, if anyone wishes to download my work.

This is just an example of the pop up window that displays my image at full resolutuion.

 This is the video tab where i have uploaded my favorite videos. One is if a short animation i created and the other is of a speed painting that i have produced. I thought that i would need more to jsut having two videos on website so i went through different options of what i could do. I thought maybe of getting a video player, but that takes up a lot of memory and makes the loading time longer. I thought about maybe haveing a serperate page again like the photos page, but there was not a layout that i like when i tried it. So in the end i thought of doing the same sort of thing with the facebook and twitter link. I have provided a small PNG of YouTube's logo and when clicked it will bring you straight to my channel where all my videos are available in high quality. 

This is my contact page which allows the users of my website to send me an email on any questions o queries that they might have. By using a simple form, the user must enter a name and email in order to send a message, This can all be pre defined in all of the coding.

Creating A Form

Here we inserted a form into our contact page. To do this we used the same insert window that we used to create the spry. By clicking on the form section we were able to create several buttons that can store information. we created a name button, a email button and a comments button, a submit button, and a reset button.

You can customize these buttons to store certain information and also not to submit if information is missing. On the settings of the email button i ticked email address which means that the coding will look for the "@" sign before yu can submit it. I also but that this infmoration was mandatory and so is the name. The comments section as well as the name section can have any letters in them, however the comments section is not mandatory.

Mobile Website Experimentation

This here is some individual experimentation that i did. I focused on experiemnting on a mobile device but still used dreamweaver to create the pages and such.

I added a simple header or banner which is my own image. I also added a spry table so that it makes the website more interactive which i think is important because you have to compensate for the lack of space with interactivity to keep interest and it makes for faster loading times.

Here i found an addon that can support the iPhone IOS which allows you to customize the content of teh buttons and menus while keeping to the same iPhone design. I have seen this on only a few websites online. I think this is not a very popular style of mobile web apps because there may either be an issue with copyright or the fact it is quite simplistic.

After playing around with a few other add ons that i downlaoded i managed to get a really cool slideshow of some of my graphics. This caused a few problems though as for some reason the coding restricts the accsess of you being able to use source images that you have in your project folder. This could be due to the way the add on animates the images together because it does iot through a private server so your images have to be online. A simple way past this was to upload to sizes of the images to this blog, one large one thumbnail, and then embed the code into the add on.

Another simple add on that i incorporated was to have a map. This is as simple as dragging and dropping the addon in to a box that you have created. But before you do that you have to customize the settigns in the preferences tab of the add on. This is vital because you need to change the dimensions  of the map to fit in your box, else it will be on a huge scale and wont operate properly.

I also added a YouTube video by simply embedding the code into the java script. But before i did that i had to make sure that the code had the right height and width. There is an option of having a Youtube player, but i was wondering if certain devices ould be able to handle it because it requires flash.

Images for mobile site

Mobile Web App

This is my website that i created on Dreamweaver. By importing it in a new folder into Titanium Studio  I was able to run it on the ios version of an apple device. 

This is the home screen of my website. The first obvious thing to notice is that the website is clearly designed for desktop. The buttons are too big, and the background needs to be modified to either fit the screen or change all together. 

 

Even the vidoes that i emeded from youtube worked on the iPhone device.

Here is the image that you can click on off of the table. As you can see the image is way to big to fit on the mobile screen.

Titanium Studio

This is Titanium Studio and is used to create mobile apps. Here we began buy learning some basics about how it works and the different operating systems. We started by using code snippets provided to set up a simple background colour and heading with text. The snippets consisted of variables which we had to call to the programme so that they would be displayed.

Here I customised the text and added a picture to the web app. I also edited the text to match the picture. This is the start of a very basic mobile web app.

This is the source image. I made it smaller to reduce the file size so the web app would load faster.