Lab 15 Dropdown

      In this lab, we add new features into our navigation bars, text, and images to make it more interesting. After we have learned how to create a navigation bar, it's time to move farther, so we learn to make dropdown contents. Our task in this lab is to create  a dropdown navigation bar, text, and images. This can be done through the use of CSS with all those dropdown classes. For the navigation bar, we need to use a button class called dropbtn. For the dropdown text, it's just the the same divisions and classes. And for the image, we need to create a desc class there will be text or labels under the dropdown content.

     First, we need to create a dropdown class, then adjust the dropdown contents and other dropdown classes in CSS to the way you desire, so when the mouse is hovered on that element, it will dropdown something that we design it to show. For the dropdown navigation bar, I used the same navigation bar I created in lab 14, and I made a dropdown button using the dropbtn and created a other button, and the contents are the two links to my blog and my teacher's website which will appear when you hover on the button. For the dropdown text, I simply just put Hi! as the dropdown content using span. For the dropdown image, I used a image of flower I took at the amazing Gantry Plaza State Park, and the dropdown content for this is larger version of the image with a short explanation at the bottom using the desc class.

Lab 14 Navigation Bar

      This can be said to be one of the most exiting, fun, yet challenging lab we have ever had. But this is only for most of the other students in my class. Learning how to create a navigation bar was one of my most interested thing that I wanted to know about ever since I started my first project of this year. In result I have already learned how to create this through the help of W3schools and videos from Youtube. Although I already knew how to create this navigation through my research during the process of Project 1, it is nice to have a review of it to help me remember it better. 

       In this lab, I have created this navigation bar similar to the one I used for nearly all of my webpages but this one is somewhat different as it is not created along with a division as I did for all other ones and I have also changed up the colors a little bit, but it is still along the theme color of my website. I have also used the same font and a bit of text shadows as well because I just loved the way it looks. And last, we make this navigation bar appeal in all of the labs and projects that we ever created this year which is just simple copy and pasting from one lab to another.

Lab 13 Wordler

      This is lab 13 where we explore and playing around with new features that we had never knew. As we were told we will be creating a website of our favorite teacher from I.T.H.S as our project 3, I knew we will have labs during this time that is very simple, yet teaches us something new and fun. We were to write a paragraph about of our favorite teacher then use this website wordle.com to make a very interesting collage with the words that was used.

      For project 3, I chose Ms. Ha，my living environment and chemistry teacher in 9th and 10th grade. So I wrote about what I was told during my interview with her. And to make the most important words larger, all I have to do is to make those words appear more than the other ones. Such as "Ms.Ha," it was the most used words in the paragraph, so it appears the largest of then all. After randomizing for quiet a while I had finally found the perfect collage that I was looking for. It is simple, just black and white, but it had a amazing cursive letters which appeal to my eyes
.

Lab 12 New Years Resolution and Dreamweaver Configuration

       Initially this lab was for us to write about our new year's resolutions. But that was until we had a new task that is to be performed during this lab which can take up some time. However, it is very simple. After we finish writing about this new year's resolution, we were asked to create a new site for every single lab and projects in Dreamweaver. But in fact, no change is made into the server at all, we are just creating a quick short cut to all these labs and projects within Dreamweaver.

      To configure all of the labs and projects into site, first go to manage sites, then add new site. Type a name for that site, then put the local location of the folder under it. Then Put in our account of the server in it and the location of where that folder exist on the server. Repeat the whole process until all the labs and project folders and created in a site in Dreamweaver. And last, make sure to check if they are all configured correctly by checking if all of these sites can go to the remote server location where it should be without any issue.

3D Printing Trip in QCC

     In December 7th of 2015, I went to a field trip to Queens Community College along with my digital design class where we learn about digital manufacturing. After the bus arrived to QCC in about 30 minutes from ITHS, we were settle in a classroom in the technology building with MD.Lawrence. He show us how to use Solid Works which is a software used for designing 3D objects. We got to try using ourselves too. By making something in 2D first, then stretch it into 3d, we created many different 3D objects on the software. We were told that 3d printing is changing many industries with its additive form of creating an object, because most of the tranditional way of manufacturing requires subtractive form that takes away parts from an created object, which may be faster, but will not be cost efficient. Something that is used to be made by multiple components can be made in one time with a 3D printer and additive manufacturing. 3D printing object are simply powders bonded by some type of glue or laser layer by layer. It was said that 3D printing is widely used in the Jewelry business where they use a support material that can be dissolved in water to create support for all different special shapes of build material.

      After our lesson about 3D printing, we were brought to another classroom and the nice staffs and faculty of QCC were very nice to provide us a nice lunch of pizza. At the same time, we were provided with a chance to talk about some of the important information to know and understand for our future careers with very intelligent and experienced people from this school. It was a nice time.

Hour of Code

      After the Hour of Code last year during my 2 year of high school, we had so much fun and have learned much from it. So this year, our class decided to participate in this event again. During these time, we even had people we are professional at the technology field to talk to us about all the  thing in the field and all about programming. They have thought us a lot and have helped us to understand many of the things relating to the process of being such successful people such as they are. In this year, we will be participating the HOC event from Codecademy. We learned about both html, css, and also java script that we were never been taught yet. We need to complete the "Animate Your Name"
tutorial that teaches java script, the "About You" tutorial that teaches you about simple html script, and the "Sun, Earth, and Code" about css scripts. After the tutorials are completed, we were ask to copy all of the codes from the tutorial and create a webpage consisting all those elements. 

      This was a very amazing experience learning from these tutorials, I have learned many thing I never knew, and it is only now that I have realized that there are so many sources online that can teach you about coding in a very precise way. After I have completed the tutorials, I created three file in Dreamweaver, a html, a css, and a java script file. I have copied all the codes into my files accordingly to its types. Then I began to changing thing, troubleshooting, and decorating the webpage. I have change the the the background into one of my creation and the image into myself and changed the color of the button. Then I made the sun and earth smaller and changed its place on the website. But since the code was very complex, it took very long to have it the way I wanted, and it's still not perfect. After it had been sure that everything worked after troubleshooting, we upload it as one of the labs we have did during this class.

http://techteach.us/DD2015/HJiahua/Labs/HOC/HOC_Jiahua.html

Lab 11 Linking Prototype Pages

      For so long I have thought that Firework and Photoshop were almost the same software but with a different name. But that was only until I did this lab, I have totally changed my mind. During this lab, I was taught that Fireworks are able to create a website all by itself using images and a hot-spot to link everything together. In this lab we will be using Fireworks to make a prototype of the web pages we will be creating for project two. It serves the purpose to ensure that we all understand all the necessary steps to create the Favorite Cartoon Character website. We are required to make 4 pages, one called the master page that contains element that will exist on all other pages, one called a home page that we must decorate, a biography page where we only need to show that its a "bio" page, and a process page the says "Pro". And link them together.

      To create the lab, I first create a new document in Firework and make 4 empty pages. As that same time I have finished working on the background, the character, and banner for project two. I put the the background that I designed in Photoshop into the master page as well as the banner that says "home" on it. And since I have not finished designing the buttons for project 2 yet, I just added three text boxes on the most bottom for the use as links for the home, biography and process page. I also add a text box that says "by Jiahua Huang" and is designed to be linked to the master page. On the home page, I add the finished work of my favorite cartoon character, the minion. On the biography and process page, I just added a text that identifies the page and just link everything together. 


 http://techteach.us/DD2015/HJiahua/Labs/Lab11/Home.html