Wednesday, December 16, 2015

final_projectprt6


The final layout of my webpage is finished at this point. Only a few details remain to be finished. The menu bar contains the three pages I finaly decided on. Though I do plan to change them again at some point. The picture above is in a divider within a divider, width set to 100% so it can reach across the "white" screen. Online I found that an olive color matches well with the colors black and white, and so I decided to use that as the navbar background. I also plan in the future to implement some CSS3 for transitions to make the site more "interesting". 


The about me page turned out very nice in this new format. There are some things I forgot to edit while presenting the site to my CS250 class, and their feedback was very helpful. Moving further into my skills as a designer I plan using vital skills i learned during this project. I also plan on taking more pictures to fill up my site and perhaps use fancy box for my homepage. The site is finished as a final project. I do plan on returning to this website and updating it with more time, and much more attention to design detail. 


finat_projectprt5


I added place holders for the site and did not use css yet to fully align everything in place. However this is just for me to see where everything is, and where it currently is. the footer is something new I decided to put on this page. It is red in the picture just so I could set the color, and float methods. To this point I did not yet work out. To his point I was putting up a performance of my chopin ballade in the music page, and a youtube video of my Vivaldi performance with an Orchestra from high school. 


final_projectprt4


I have completely remade the layout of my site! I figured about using only half or a little over the screen to make the website look like a music "program". I stuck with the color scheme black and white. I'm not much of a color theorist so I looked online to find a matching color set to black and white. This color scheme also goes well with the colors of the piano, which is my main instrument. I was also at this point on the fence about making 4 different pages, one home, one about me, one for my CS projects and the other for my music. though I am not sure if I should go ahead and separate the pages. 

final_projectprt3


This is the about me page which will explain a little bit more about my background as a musician and a computer scientist. I plan on having a picture here of me, though I have just figured out I have no recent pictures of myself that are important. I should probably take more pictures at concerts, and events, Here I was also thinking about switching the layout of my site, as I stayed in my last post, I was not very satisfied with the outcome of the site. In the next post I will update the sate layout, as well as the color scheme. 

Final_prt2


The Image above is how i originally constructed my website. It was not all to difficult to set it up this way, however, I was not fully satisfied with it. I'm not a fast designer on the spot, and this was made using an outline I had originally blogged about. All the dividers you see here are set as place holders. I was wanting to use the whole page layout for the project, but I did not have the "vision" to pull off such a task. I will recycle this layout for later, perhaps use it in another project. 

Thursday, November 19, 2015

Final Project Part1

For this final project I have decided to do a biography website, on myself. The following images are sketches and a flow chart about what I want my site to look at.


The flow chart shows the navigation the user will ultimately use. From the home page, you have two options, about me and my projects/portfolio page. From the homepage the user will be able to click a social media icon and with will lead to my social media sites. From the about me page user can navigate to home or the projects page. The about me will have listenings of myself performing. The projects page will have links to other projects I have done, as well a small introduction to each project (requirements, steps I took, group work etc.)



The image above is a rough sketch of how my home page will look. A very simple navigation bar with simple colors (black or white). I am not yet sure if I want black and white colors to match the colors of a piano, or a background of a piano. From my homepage users will be able to navigate to other pages and also to my social media pages. I plan to have a slide show at the top of the page with different images, and when clicked, each will take the user to one of my other pages. 


The image above is what my about page should look like. I plan to have some text about myself, and Image, and then some performances of myself, with the user being able to control the sound.  Should I find that I need more details or less, or even chained, then I will adapt accordingly.

Thursday, October 29, 2015

projectLog_6


This is the final home page in html. I was out of options trying to figure out what it should look like. If given more time I would have added pictures to the homepage, perhaps making each planet a splash screen so that when you click on the picture of the planet it would highlight the outline of the image, then transfer you (should you click it) to its corresponding page. Our site is live on a team member's server. 

For this post I will be using earth as an example for all our pages. When you are directed to any planet page this will be the layout. 

After the planet and the menu bar, you get into the body portion of the page. Here you get the actual information of the planet my group and I determined. The table opacity is changed for easy reading. In the table there are links to other pages. 


the last part of the website has two images and more links. Some have other facts about the planet.