Posted in all, Uncategorized, Weekly Assignments

Learning activitie – Planning the structure

Create the structure of your web page (from Learning Activity – Put Thought Into Your Design) in terms of HTML files and folders. You need to set these up so that you are ready to code your website.

First use a pen and paper to do your planning; then do it on the computer when you are sure of your structure.

Please upload this activity to your WordPress blog. Remember to scan and include your initial planning that you did on paper.

 

Here is the structure of my page both in paper and on my computer!

ScanUntitled picture

Have a nice week!

Posted in all, Uncategorized, Weekly Assignments

Studio Lightning- Practical Assignment

Take some portrait shots and pay specific attention to the lighting you use. I would like to see a shot with soft lighting and one with more dramatic, harder lighting. It would be beneficial to hire studio lighting, but if you can’t, you may use natural light, reflectors and your camera’s flash.

 

I could not afford to hire studio lighting so I had to experiment with natural light , lamps around my house,  a home-made reflector (which I made out of aluminium foil and a piece of wood) and Photoshop of course. I hade a lot of fun experimenting with light, but I feel that I still have a lot to learn! Here are some pictures of my progress. I fixed most of them in photoshop to practice this aswell.

In this first one I used very harsh lightning, I feel that it would have worked best with a dimmer light or a reflector instead. Here the key light is  natural light ( coming from the window) is right in front of him. The hair light/silhouette light is coming from his left(this would be the harsh light) and an extra filler light is coming from above to his right. So you can see that I tried to experiment with three light set up in this picture.

Toreblue

In the two following pictures I have only used natural light and my home made reflector to fill out the shades, it gives a more natural and pretty look.

IMG_6381-RecoveredIMG_6373-Recovered

In this picture I experimented with a two light setup. I used two lamps on each side of the subject and got this really cool look that makes him seem more angry and marks up his expression really good! sur tore brighter

In this picture I also used only natural light, coming from the window from the subjects right to create a more interesting look. I used a dark background to make more  contrast as well!

DDmodifisert

 

Posted in Uncategorized, Weekly Assignments

Studio Lightning

Part 1

1. Name 3 light sources and their functions

According to the article  we had to read, professional studio photography can be divided into two types of light sources. A kit with flash heads and power packs, and a mono light kit. To these two I will add another important light source that produces natural light, the sun!

I will start by explaining the function of the kit with flash heads and power packs. As you probably already guessed this consists of separate powerpacks as a generator that provides energy to the flash heads. You can find two types of power packs, symmetric and asymmetric.  The symmetric ones split power equally between several flash heads. The asymetric ones lets you control how much power to send to each flash head. This kit is more useful outdoors where you would need a lot of power to overrun the sun.

A mono light is a compact substitute for the light source above, their size limits their power but they are more easily portable than the kit above.  They are also perfect for indoor photography.

The sun or outside ambient light can also be used as a light source in studio photography, it can be used as the main/key light or as a secondary one if it is coming from a small window and lighting just a part of the subject. It can also be hard or soft depending on the weather and time of the day. As you can see it can provide us with a lot of options with one draw back, it is difficult to control!

2. Name 2 light modifiers and explain the difference between them

Light modifiers are extra accessories that allow you to control and modify the light from the light source we can use and find a lot of objects to do this but I will name two here.

Let’s start with umbrellas, umbrellas or reflecting umbrellas provide us with a lot of options to modifying light. They are used mainly to produce a diffuse and soft light due to the large reflecting surface. They are mounted in a way that the light is pointing towards the umbrella and away from the subject. so the umbrella mirrors the light back to the subject. You can find several types of umbrellas, silver light, golden light and white umbrellas. The silver ones are the ones that reflect the light more narrowly, white umbrellas have a wider spread and golden ones provide us with a warm tone.

Another well-known light modifier is the soft box. These are usually square or rectangular and are light weight boxes which come with a reflective inside and a translucent front. These are attached to the front of the strobe over the light source. The light that is emitted from the strobe head gets reflected inside the wall and then diffused through the translucent front creating a soft but more focused light source.

The main difference between an umbrella and a soft box is that the soft box provides us with a more contained spread of light while the umbrella can easily spill light everywhere, so it isn’t as controlled as a soft box.

2. Draw a diagram and describe the 3 point lighting set up

Scan

Part 2

Draw three studio setups for the following subject matters and list all the equipment that you would use to light your subjects:

  • Portrait
  • Fashion
  • Beauty

eee

In a magazine or on the internet, find one fashion shot, a beauty shot and a portrait shot and explain how you think the lighting was set up on each shot :

1.Fashion shot

tumblr_m2hvwzKGcE1r15ibfo1_400

This is the fashion shot I found. Judging by the shadows in this picture  the main light was positioned to the right of the subject from her perspective. I would guess that they are using a pretty big and soft light  positioned near the subject, that causes a diffused shadow on the wall. It seems also like their are using a second light pointing ar her to fill in the shadows, this one seems to be further away because of the harsher shadows it creates.

2. Beauty shot

In the following shot I would guess that they are using a two light setup. One to That is lighting up the subject from the front. and one that is lighting up the background. I also think theat there might be two lights from each side of the subject that are mainly lighting up the background but spill a little of light on to the subject. They are using colored lights one is blue and the other two are orange.  The light pointing at the subject is soft, so I would say it comes from a big soft box.
a098916c1cea2a2b42ff18e6ddbbd013

2. Portrait Shot 

My guess here is that this is a 3 light setup. The model is looking at the main light source wich seems to be a big soft box. There is a harsh light lighting up the background and a fill colored light lighting up the back of the model.

4

I will post part three later this week, in another post… bye, bye for now!

Posted in all, Uncategorized, Weekly Assignments

Learning Activities- Put thought into design

Design a 5-page website or blog to promote your hometown (or any other place if you so choose). Present your design along with a strategy that explains the decisions you’ve made during the design process (keep the six steps mentioned in the lesson Web Design Process: Designing for Web (part 2) in mind). Remember, it’s important for us to see how you think, so explain why you decided to do things the way you did.

This is a front-end design learning activity. No coding or publishing is needed.

Please upload this activity to your WordPress blog along with a Word document or PDF explaining your strategy.

 

Visit Bergen Page!

Strategy

Posted in all, Uncategorized, Weekly Assignments

Redesining a website

Copy the exact content from a homepage of a website of your choice. Now redesign this homepage in three different ways. Each design should evoke a different emotional response from viewers. You can choose what you would like these emotional responses to be.

Please upload this activity to your WordPress blog along with a short report where you explain the look and intent of each of the three designs.homepage

As you can see from the picture, I have chosen to use the norwegian website. I am going to describe the current look first so that it will be easier to experiment with other looks and really see the difference.

First of all I would say that the site has a very norwegian feeling because of its use of colors that reminds us of the flag. It also portrays a feeling of friendliness and helpfulness. I also get a calm feeling from the site and a feeling of control.

I am now going to interpret this effects and find out why this site gives me this feelings, to do this  I am going to examine the following elements of design used on this site: Lines, shapes, texture, color and Type.

Lines:

lines

As you can see in the picture  they use lines a lot in their design to distinguish important elements from others and to give the user a better sense of position, letting the user know where they are. They achieve this by mixing lines and shapes with different colors to draw attention from the eyes. This gives the user a feeling of control.

Shapes:shapes

As you can see in their picture all their website is formed by rectangular shapes of different sizes, this makes all the content organized an creates a hierarchy that leaves you with a feeling of calmness. The most important shapes are underlined with a strong bold line which sets them apart from the rest again giving you a sense of control.

Colors:

I believe the colors used make the site great. If you think closely the color palette in their brand contains a lot of strong colours that all fight for attention so I think it would have been really easy to make a messy looking site with those colors. But norwegian has achieved a really nice minimalistic look by using their colors in a smart way. They combine them with a grey tone and use a lot of white to make a calm a nice looking site. Where they use their other colors to highlight the important stuff.

Type:

the type used in the site contributes to creating a friendly and informal feeling. They use a sans-serif type face throughout the whole site giving it as well a calm feeling.

Texture:

I don’t have so much to say about the texture other than their use of big high quality pictures as the front one, in my opinion using pictures as background in this way creates another dimension and depth to the site and it makes people more curious and it makes the site easier to process, specially because they use images and graphics to communicate instead of only using text!

My designs

#1

This is my first redesign, I wanted to create something even more simple and friendlier.

norwegian 1. redesign

I tried to achieve this look by rounding all the corners and playing with augmenting the use of colors. I used the red since its was the one that reminded me most of norwegian. I also added a drop shadow to pop the”folder with all the buttons”even more and to give the design some depth, since the picture wasn’t there to do it. I made the logo bigger and put it on the right side so it would be the first thing people saw. and put all the buttons in the grey folder to organize everything more and put everything in one place. I also put some drop shadow in the drop down menu so it would be more noticeable as a button!

I got kind of inspired by google and their simple design.

#2

2.redesign norvegian.png

The second redesign focuses more on the use of lines and shapes to guide the user’s eye. It is also more sale oriented than information giving.

Here is the link to the picture I used.

Posted in all, Uncategorized, Weekly Assignments

Creating Wireframes and finding a hosting service!

Sorry for the late post! I a lot of trouble with my internet connection yesterday so I couldn’t upload the assignment on time!

Moving on, here is the first assignment:

Now it’s your turn to create your very own website wireframe.In the last assignment, you had to come up with a list of 10 questions for a briefing form. I would like you to now fill in this briefing form, take the answers and create a wireframe for the site.This wireframe do not have to be a wireframe for your current Mandatory Assignment (Product Website) it’s purely for you to practice your skills.You can choose if you want it to be a lo-tech or hi-tech architecture.  Regardless of which method you choose, I would like to see as much detail as possible. Also, please write a short paragraph to explain why you chose the lo-tech or hi-tech option.Please upload this activity to your WordPress blog.

 

 

What kind of visitors are you expecting on your website? (Consider their income, interests, gender and age.)

This question helps you to understand the potential visitors better. If you know who your target audience is, you can plan the website design and development in a way that would appeal to them. Obviously a site for teenagers will be very different from a site for working moms or businessmen.

  • Folk som er interessert i kunst
  • Vil ha informasjon om åpningstider, medlemskap og arrangementer
  • Er interessert i kulturliv og kunst

What actions do you want visitors to take on the site?

A website can sell products, provide information, educate or encourage a visitor to make a phone call or fill out a form. Depending on the client’s needs the website structure, functionality and design can vary substantially.

  • Information about opening hours
  • Information about events
  • Form( to subscribe to the gallery )
  • Information about the different exibhits
  • About us
  • About the artists
  • Sosiale mediaer

What is your deadline for completing the site? How big is the budget?

These questions help you manage the client’s expectations. Your purpose is to set clear and realistic time frames, which are linked to the budget. In other words, your client can’t expect you to build an extensive website in a day’s time. And they can’t pay for a beat up old VW Beatles and expect a Porsche.

  • Normal budget, no deadline

Who will be the contact person for this project?Sometimes big companies have more than one person working on a project. Since people have different opinions and ideas, this could get quite chaotic. Ask the client for one contact person that you can deal with if you have questions or need feedback.

  • The Gallerie’s Principal

What do you NOT want on your site in terms of text, content, colour and graphic elements?

Sometimes it is as important to know what your client doesn’t like as it is to know what he or she does like. This can help you get a full picture of what the client has in mind for the site.

  • Clutter, to many colours or

How should approvals or presentation of projects be handled?

this makes it easier for you both in the long run

  • 1-2 meetings each week

Present your business, what do you love about it and what are you most proud of?

the answer of this question will give you tips on what content is the most important to include in the page and how the page should look to represent their bussiness

  • The art museum is a perfect place for cultured life. We think it is important to perserve the culture experiences in society, our museum works towards this goal by providing a place where people can learn, reflect and be inspired by todays and yesterdays artists.

What level of control do you really need over your site’s content?

( this will be important when choosing how to build the site so it is user-friendly but also customer friendly. ask about what kind of control they need)

  • Need to post about new events
  • Communication with clients/visitors

what is the exact motive and reason for the new design or for creating a website for your business?

( is the other one outdated, why do they think so, Do they need to advertise on more places for their products, are they trying to get a wider target audience… The reason might help you solve the problem).

  • We want to provide people with more accecible information about the museum and everything that happens here, and reach out to more people in general.

What tone or image do you need to portray?

  • A profesional yet open image that inspire and attract people to our site.

Here are the wireframes to the site I chose, which was a site for a museum and art gallery! I chose to make a lo-tech wireframe because this allowed me to be more flexible and creative.

DDmodifisert_2DDmodifisert_1DDmodifisert

LA02-Providing your own hosting service

Here is my domain that I created with proisp.no as my host.

Untitled picture