Editing class and Effecting class. Editing hand-out: this is video hotkeys to edit the film. And I used it very useful. This helped me work faster than I did; effecting hand-out: this hand-out helped me to know meaning of tool. And also I used it when I gave effect to my video. And there are 2 OS version to do. Students in the Leadership program do a lot. They oversee student activities on campus, run the lunch time intramural program, organize and lead the mentor program, help with the assemblies, recognize student achievement, help lead the assemblies, read, play, learn to trust, discuss and learn first hand what it means to be a leader.

• Unit 2: Foundationsmr. Mac's Class Website Free
• Unit 2: Foundationsmr. Mac's Class Websites
• Unit 2: Foundationsmr. Mac's Class Website -
• Unit 2: Foundationsmr. Mac's Class Website Answer

Introduction

When styling links, it is important to understand how to make use of pseudo-classes to style link states effectively, and how to style links for use in common varied interface features such as navigation menus and tabs. We’ll look at all these topics in this unit.

Let’s look at some links

The first thing to understand is the concept of link states (different states that links can exist in, which can be styled using different pseudo-classes):

• Link: A link which has a destination (i.e. not just a named anchor), styled using the :link pseudo class.
• Visited: A link when it has already been visited (exists in the browser’s history), styled using the :visited pseudo class.
• Hover: A link when it is being hovered over by a user’s mouse pointer, styled using the :hover pseudo class.
• Focus: A link when it has been focused (for example moved to by a keyboard user using the Tab key or similar, or programmatically focused using HTMLElement.focus()). This is styled using the :focus pseudo class.
• Active: A link when it is being activated (e.g. clicked on), styled using the :active pseudo class.

Default styles

The following example illustrates what a link will behave like by default (the CSS is simply enlarging and centering the text to make it stand out more):

You’ll notice a few things as you explore the default styles:

• Links are underlined.
• Unvisited links are blue.
• Visited links are purple.
• Hovering a link makes the mouse pointer change to a little hand icon.
• Focused links have an outline around them. You should be able to focus on the links with the keyboard by pressing the tab key (On Mac, you’ll need to use option + tab, or enable the Full Keyboard Access: All controls option by pressing Ctrl + F7.)
• Active links are red. You can try this feature by holding down the mouse button on the link as you click it.

Proposed exercise: Larger and centered links

Create a web page with at least 5 paragraphs, each one with a different link to any sites you like. You also have to style your page so that the links are double the size of the rest of the text, and they are aligned in the center of the window, as done in the example above.

Styling some links

Interestingly enough, the default styles used for the links are nearly the same as they were back in the early days of browsers in the mid-1990s. This is because users know and have come to expect this behaviour (if links were styled differently, it would confuse a lot of people). This doesn’t mean that you shouldn’t style links at all, just that you should not stray too far from the expected behaviour. You should at least:

• Use underlining for links, but not for other things. If you don’t want to underline links, at least highlight them in some other way.
• Make them react in some way when hovered/focused, and in a slightly different way when activated.

The default styles can be turned off/changed using the following CSS properties:

• color for the text color.
• cursor for the mouse pointer style, although you shouldn’t turn this off unless you’ve got a very good reason.
• outline for the text outline (an outline is similar to a border, the only difference being that border takes up space in the box and an outline doesn’t; it just sits over the top of the background). The outline is a useful accessibility aid, so think carefully before turning it off; you should at least double up the styles given to the link hover state on the focus state too.

Now that we’ve looked at the default states in some detail, let’s look at a typical set of link styles. To start off with, we’ll write out our empty rulesets:

This order is important because the link styles build on one another, for example the styles in the first rule will apply to all the subsequent ones, and when a link is being activated, it is usually also being hovered over. If you put these in the wrong order, and you’re changing the same properties in each ruleset, things won’t work as you expect. To remember the order, you could try using a mnemonic like LoVe Fears HAte.

Now let’s add some more information to get this styled properly:

We’ll also provide some sample HTML to apply the CSS to:

Putting the two together gives us this result:

There are several browsers available, such as:

Proposed exercise: Styling colors and text decoration

Create a new web page with at least 5 links pointing to your preferred websites. You must change the default colors and decorations so that each possible state (link, visited, focus, hover, active) has other color than the default one, and also another decoration, as done in the example above, where the “underline red wavy” text decoration is used.

Including icons on links

Some developers include icons on links to provide more of an indicator as to what kind of content the link points to. Let’s look at a really simple example that adds an icon to external links (links that lead to other sites). Such an icon usually looks like a little arrow pointing out of a box (for this example, we’ll use this great example from icons8.com).

For this example, we will use the same HTML as before:

And we will adjust the CSS code:

Putting the two together gives us this result:

There are several browsers available, such as:

So what’s going on here? We’ll skip the CSS related to the paragraphs, as it’s just the same information you’ve looked at before. The last rule however is interesting : here we are inserting a custom background image on external links using background shorthand instead of the individual properties. We set the path to the image we want to insert, specify no-repeat so we only get one copy inserted, and then specify the position as 100% of the way over to the right of the text content, and 0 pixels from the top.

We also use background-size to specify the size we want the background image to be shown at. So that you get a good result, it is useful to have a larger icon and then resize it like this as needed for responsive web design purposes.

Finally, we set some padding-right on the links to make space for the background image to appear in, so we aren’t overlapping it with the text.

Proposed exercise: Links with icons

Create a new web page with at least 5 links pointing to your preferred websites (you can use the code you wrote before) and include an icon at the end of each one. Also change some other styles as the text color or text decoration.

Styling links as buttons

The tools you’ve explored so far in this article can also be used in other ways. For example, states like hover can be used to style many different elements, not just links — you might want to style the hover state of paragraphs, list items, or other things.

In addition, links are quite commonly styled to look and behave like buttons in certain circumstances — a website navigation menu is usually marked up as a list containing links, and this can be easily styled to look like a set of control buttons or tabs that provide the user with access to other parts of the site. Let’s explore how.

First, some HTML:

And now our CSS:

This gives us the following result:

Let’s explain what’s going on here, focusing on the most interesting parts:

• Creating a new class for the list:
  • We have created the navbar class so that only the items inside that class have the style of a navigation bar.
  • ul.navbar: By putting this before any selector, the CSS properties between braces will apply only to the items inside an unordered list with class navbar.
• The styles related to the <ul> element:
  • We change the font-size to enlarge the text a little bit.
  • We change the font-family so that it is different from the rest of the text.
  • We change the text-align so that the links are centered .
  • We change the background to yellow color.
  • <li> elements will normally behave like block elements (they sit on their own lines). In this case, we want to create a horizontal list of links, so we set the display property to inline, which causes the list items to sit on the same line one after the other (they now behave like inline elements).
• The styles related to the <a> elements:
  • We start by turning off the default text-decoration (we don’t want those spoiling our look).
  • Next, we set the display to inline-block (this will allow to size them, as we will explain in another unit).
  • We set the padding to 1rem to give the buttons some space around the text (we will also explain this in another unit).
  • We also change the color of the items when the mouse is over them, and when they are being pressed.

Proposed exercise: Navigation bar

Create a web page with a navigation bar of your own style. You can change any properties you like (colors, text decoration, font size, font family, etc.). After that, just below insert some other links you like. You can also try to use some other CSS rules to style these links, as shown below:

There are several browsers available, such as:

___________________________________

This is teacher’s feedback and I can understand about what I was wrong. and There are several things to fix it. And my report got more detailed. Today I knew other words to change it. and this help me think more detail in the project. and it also help me to find collect words which is more fit in sentences.

Presentation Video

This video is shown you how I did presentation. and I post it on the Internet in ‘Youtube’.

Before I told it, this time is amazing experience in my high school~

[After presentation]

Today I was so nervous to present my film. It was difficult to present it to me. so my face became red, I shook my hands. so I’m so sorry to me.

But It was fantastic experience to me. Because I never present to speak in English. And also I could appeal my film to other people. and this is very good chance to notice my film.

After presenting, I monitored my presentation video, and I left a little to be desired. I was so nervous and then my face is so strict, no smile. This is the most thing that I supply from now on.

I came out with something new about my film using PPT. But then, I have to add this PPT in the file that I gave to teacher. and this ppt have its own font. But the font fall outside PPT. I could not add this PPT , so I made the presentation video using Premier to knowing about my PPT contents. and It helps you understand more detailed.

Photo that I announced

Today I finished making my presentation PPT. and I chose a PowerPoint tool. Because it is help to make more detail things. And I use 4 colors which is helpful to see this presentation.

4 colors :

Their color makes feeling more warm atmosphere. And each of category will be discussed the table of contents and overview, background of scenario, the change of schedule, etc.

First page :

I emphasis on the beauty of the margins clear and simple for fabrication. Especially I expressed the background of the scenario in detail. And I gave animation effects to prevent being sick of watching.

ppt file : time adventure preproduction.pptx

[script]———————————————————————————————-

#1

Hello, everyone. Today, you can listen about my awesome project.

#2

At once, there’s a table of content.

It contain brief introduction, background of scenario, requirements of process, viewing video, and reflection

#3

For this unit, assignment requires me to create a 35 second motion-graphics sequence for the opening titles of a new children’s TV show called “Time Adventures” which will be broadcast on Sci-fi channel. To produce this product, I planned pre-production schedule, wrote documents, considered about budget, and something else. I realized again that these works are essential elements before making a video.

#4

At the first time, I thought that the topic of my film should be creative and easy to understand for everyone. So, I struggle to find out many films in ‘Youtube’ and ‘Vimeo’ to make my film. It was hard time.Secondly, because the film is for children, this film is familiar to the children’s life.I searched about interests and behaviors of children.

#5

For example, I met my cousin on holidays, and I watch them closely. They played mobile game with smart phone.

#6

‘Eureka!’

I decided that the topic of my film is about going time adventure smart phone application. I was sure that it is familiar to the children.

#7

When I started my plan, several things are changed or modified.

At First, I tried to rent the camcorder to make the film. But actually, I used my own camera because of the lack of budget.

Secondly, I composed background music by myself because of the budget.

Copyright of song is mine. So I didn’t have to concern about the legal issues.

Finally, I finished making my video.

#8

Let’s watch the video!

#9

(watch the video)

#10

But, I had some difficulties to complete the work.

#11

I had to prepare each of hand image and background image.

#12

But unexpectedly, I didn’t think that images are existed apart. I reminded that I divided these images again and again. Fortunately, I could do work in time, so I didn’t need to modify the storyboard.

#13

I was a member of the video production club and I did not have awareness about the pre-production. But now on, I’m happy that when I consider and prepare lots of things to consider such as budget, personal, legal things and so on.

In particular, I caught the concept of copyright definitely. It is really help me to think more about the video.

I am really satisfied to finish my project .

#14

Do you have any question?

#15

Thank you.

Unit 2: Foundationsmr. Mac's Class Website Free

—————————————-

Today I finished writing the script and I wrote a script based on the report. So the script will give you the feeling of seeing a report. And I tried to use easy words to understand. Finally, what I hope to have finished a successful presentation.

———————————

Today I did self-correction myself. So I checked my report that I had wrong Grammar, Word choice, Sentences and so on. And I think there are many check points when I checked it. and I also changed the sentences more easily. After did this work, Teacher will check my report and my elder brother will check my report because of my asking. so final report which you will see is more understood to you.

Pre Production Report

Seungyeon Han

For this unit, assignment requires us to create a 35 second motion-graphics sequence for the opening titles of a new children’s TV show called “Time Adventures”. The video will be broadcasted on Sci-fi channel. In order to produce this product, I planed pre-production schedule, wrote documents which are connected with legal materials, budget, and something else. Before making video, this work is an esential element .

I thought the keywords are that the first thing needed to be made a product was creative thinking and easy to approach. so I distressed what the concept of the video I made while finding some sites like ‘Vimeo’, ‘Youtube’ and so on. and this video is for children so I investigated about favorite children’s interests and behavior nowadays. For instance, I met my cousin on holidays, and I also saw they usually played game using smart phone. So I decided the keyword ‘ smart phone application’ for going time adventure which is familiar. And I believe that children also get curiousity when their drawing picture is becoming real situation. So I was writing these scenarios.

I tried to practice the plan and several things had changed and modified. First, as planned If I had rent the equipment, I would have used the expert camcorder.

But actually, the budget was not good enough to rent so I used own my camera which can be also used to camcorder. Second, I composed background music myself because of the budget. and the song’s copyright is mine so I wasn’t restrained legal remedy. And finally I finished making my video.

But I had some difficultie to complete the work. I had to prepare each of hand image and background image but unexpectedly, I didn’t think that images are existed apart. I reminded that I did the image work again and again. Fortunatly, I could do work in time so I didn’t need to modify the storyboard.

I was interested in the project and also real tired. I was surprised that I have to prepare lots of things to consider legal remedy, budget, hiring and so on. But it is really help me to think more deepening about the video. and I am really happy to finish my project.

————————

I wrote report about what I had obstacles. Because of budget, I could not progress as planned. But I could change plan B. so I finished my project safely. and I also wrote about my feelings to do this project. At first, I started the project with great expectations. and I was satisfied to finish my project. But also I am put to feel inconvenience little bit. so I will check about project one more time^^!

write more….

Pre Production Report

Seungyeon Han

For this unit, assignment requires us to create a 35 second motion-graphics sequence for the opening titles of a new children’s TV show called “Time Adventures”. The video will be broadcasted on Sci-fi channel. In order to produce this product, I planed pre-production schedule, wrote documents which are connected with legal materials, budget, and something else. Before making video, this work is an essential element .

I thought the keywords are that the first thing needed to be made a product was creative thinking and easy to approach. so I distressed what the concept of the video I made while finding some sites like ‘Vimeo’, ‘Youtube’ and so on. and this video is for children so I investigated about favorite children’s interests and behavior nowadays. For instance, I met my cousin on holidays, and I also saw they usually played game using smart phone. and that’s it! SMART PHONE APPLICATION! So I decided the keyword ‘ smart phone application’ for going time adventure which is familiar. And I believe that children also get curiousity when their drawing picture is becoming real situation. Then I wrote a storyboard to mix my mind.

————————

Today I wrote about my story of project.

It contains how could I think smartphone application and I also wrote my experiences in this part.

Pre Production Report

Seungyeon Han

For this unit, assignment requires us to create a 35 second motion-graphics sequence for the opening titles of a new children’s TV show called “Time Adventures”. The video will be broadcasted on Sci-fi channel. In order to produce this product, I planed pre-production schedule, wrote documents which are connected with legal materials, budget, and something else. Before making video, this work is an essential element .

———————-

I wrote report a little in Peter’s class. This part is the introduction. so I wrote about an assignment in details.

David teacher and Sheila teacher’s class

• production schedule , risk assessment ,cast and crew release form , production budget: This site help me to get handout , and actually I got some forms in this site.
  And in the class, David and Sheila taught us using this site.http://vle.westking.ac.uk/course/view.php?id=2799

Unit 2: Foundationsmr. Mac's Class Websites

Editing class and Effecting class

Unit 2: Foundationsmr. Mac's Class Website -

• editing hand-out
  : this is video hotkeys to edit the film. and I used it very useful. This helped me work faster than I did

Unit 2: Foundationsmr. Mac's Class Website Answer

• effecting hand-out
  : this hand-out helped me to know meaning of tool. and also I used it when I gave effect to my video. and there are 2 OS version to do. So I did my work on Window OS and Mac OS, too