Website Design

Inquiry and Analysis

Design Problem:
There are good resources like Quizlet, Google translate, or Managebac file to learn
languages. Google Translate is not really good for learning languages because it doesnt have
the correct grammar. Maybe when you want to say I am happy. and it actually could say I
happy. It is hard to go on websites and be on task because when your language B teacher says
to you to go on YouTube and search something, you might go on YouTube for watching movies
or TV shows not on purposely and say to your mom you are doing French homework. If you go
on YouTube you get distracted by the other videos shown on the right side or by the
advertisement I sometimes did that and I didnt know it. You tube is addictive and there are lots
of inappropriate words or videos. When you first go to Quizlet or something you get confused if
the teacher didnt tell you so detailed. You go on Quizlet and you clicked on something and it
shows up to log in. then you roll your eyes then try to make a very hard password. Then you
end up with forgetting the password and need to sign up again. It is hard to get help easily
because when your Arabic teacher says to go on a website and study Arabic the site might be in
Arabic and you would totally lost. The next day you go to your Arabic class and your teacher
asks why you didnt do the homework.
It is hard to share educational resources and communicate learning progress with GWA
community. When your parents or teachers want to see your work, it is hard because teachers
dont have access to the Z: drive. Only you can access your Z: drive but you cant access at home
because the program is not downloaded on your computer. The teacher can access Managebac
if the student submitted its work. Every teachers teaching ways are different. Some will say to
hand the work in paper, submit in Managebac, or put it in S: drive, etc. The other problem is
that if your parents want to see your work but they cant because they dont have access to
Managebac or Google account.





Research Plan:

What do I want to find out?

How will I get the information?

Why am I looking for this?
How can I make a website? I can go to YouTube or ask Mr.
Clarke for help.
Because I dont know how to make
it.
What kinds of things should I put in? By making a survey and asking
friends.
Because I need to know what
things I need to put in the website.
What font size should I use? I can look on other websites for
help.
To make a good website.
What kind of design should I make
for my website?
Look other websites for help. So kids can be interested.
How should I do the layouts? Ask teachers So it would be easy to use.
What programs should I use? Ask teachers, Ask friends that are
good at computer
So I can make how I want.
Should I put games for kids? By making a survey and asking
friends.
So when they are stressed they can
use it.
What theme will be fine for kids for
the website?
Look other websites and ask
friends
Because if the theme is scary
nobody will want to study.
Is it possible to make a drop box? Ask computer / website maker
experts in school. (Computer
geniuses)
So teachers can access
What colors make the website more
attractive?
Research by surfing the Internet So people can access more often.
What color helps your brain
activate?
Research by surfing the Internet
or ask what colors they like and
what color they can concentrate
when they are studying.
So it actually helps people doing
their work.
What title is the website going to
have?
Think about it and look other
websites.
Because the title is the first thing
you see when you go on a website
and also when you type the web
link it is usually made with the title.
What is a good website? Research I need to research about what is a
good website otherwise I can make
a bad one.


Research Analysis:
Answers for the Questions:
How can I make a website? : I will use Weebly for making websites. Mr. Clarke is going to
teach us how to make a website. For more information I found some websites that also will
help me make a website.
Video Clips: http://www.youtube.com/watch?v=0QTlO49G_wg
http://www.youtube.com/watch?v=p_g0VfcHJ0Y
What resources should I put? :

First, I will put Managebac in my website because
Managebac is used very often inn this school for checking
homework and being ready for tests or quizzes. Managebac is
where you can communicate with others and when your
teacher says to submit the work on Managebac it shows the
time for teacher if that student submitted the work late or
not.
https://edshelf.com/tool/managebac


Google is also used a lot. We use for researching information or pictures. You also can
check your School Emails from friends or teachers. Google Drive is used for Online Journal for
Math. You easily can use Google to help you with everything.
https://www.eventbrite.com/e/atx-startup-crawl-2013-presented-by-google-tickets-
7105846779



What font size should I use? :
I looked at other web pages and I saw the title is big and bold. And I knew that I didnt choose
the title for my website. In this http://contentmanagementsoftwares.net/webpage_fonts.htm
website it says to always use high quality fonts. Using fancy and weird fonts can cause
headaches especially for people who dont have good eye sight. The text that needs to stand
out likes the title or for some tabs you can use Arial Black to Arial Narrow is most
recommended.
What is the title going to be? :
Learning Language Properly I just made it up really quickly and I am going to call it LLP
because it is quite long. The website is going to be about learning languages so I said Learning
Languages Properly. People dont learn languages properly because they dont have a good
access to some websites and the website could all be in French or Arabic so you dont
understand anything.
What kind of design should I make for my website? :
I am going to use color yellow that doesnt hurt your eyes. (It is not going to be so bright)
How should I do the layouts? :
Random websites had tabs or search bar so it is easy to use. I also think having tabs are useful.
Being easy to navigate is good because being organized looks nice and neat. It can attract your
website by photos, too. http://www.yola.com/blog/what-makes-a-good-website/
What programs should I use? :
I am going to make a website by Weebly. And Mr. Clarke is going to teach me how to use it.
Should I put games for kids? :
I will ask my friends about it some said yes to play games when you are really stressed by
something. But some said it depends because if you have like mine craft or something you
would be addicted to the game and wouldnt stop playing until its time to sleep. There are
games on Quizlet like Scatter or Space race to help you write and know the meanings of words
in French or Spanish.
What theme will be fine for kids for the website? :
The theme will be good if I make the color bright.
Is it possible to make a drop box? :
Here is some video about how to make a drop box on a website.
http://www.youtube.com/watch?v=wq3-Qd8cCao
http://www.youtube.com/watch?v=SwgHfja6BCs
What colors make the website more attractive? :
Bright and vivid colors help to attract things, but if you have too many bright colors you strains
in your eyes. Also strong red color makes other people get attractive. Contrasting color will be
attractive. And if you have photos on the website you will be likely to look at it.
What color helps your brain activate? :
Having a violet colored flower helps you relax. Yellow helps focus, study, recall information, and
is useful during exams. Also yellow creates enthusiasm for life and can awake confidence.
Orange brings you comfort. I also like color yellow because it is bright. I will think about doing
the theme with bright colors collaborated.
www.womenworld.org/health/9-colors-will-help-you-feel-better.aspx

What is a good website? :
This is a website of a clothing shop. For a good website the purpose of why you made it should
be clear. If you are making clothing website like this one It says the name of the shop NEW
LOOK clearly with capital letters.












It has layers that classify new clothes, shoes & accessories, maternity, plus size, social, and sale
etc. that is near the title. In the middle there is a huge picture of clothes that models wore and
the picture changes every 3-second. I really like this website because it is catchy by the big
photo. Even though the name NEW LOOK is not that standing out it looks amazing and your
eyes just goes there to see what site it is about. In a website or in a commercial, peoples eyes
should be moving in one way. This website moves your eyes a lot. I think this has too much of
catchy things. If everything is catchy some people will get a headache. This one has a search bar
for people that cant find what they want. http://www.newlook.com/













This one is a ketchup website. This ketchup is very famous and it is in almost every
supermarket. I like the big slogan that says Grown, Not Made because it looks like it is
actually grown. Some websites say falsehoods to make lot of export volume. I really like that
next to the big tomato ketchup there is a picture of how this ketchup developed to a better
one. This is the homepage of this website and there are layers that will have further
information about this Heinz Ketchup. This website also has a search bar that will help people
to find things. I like this website because it tells about how this ketchup was made and tells it is
better than others. For better website I think to have a different color of background is going to
be better because the ketchup is red and also the background is red. If I was the person who
made this website I would have changed the color of the background to white. That ways the
tomato ketchup will be standing out. http://www.heinz.com/our-food/products/ketchup.aspx














This website is my school Weebly. I went to the resources and it showed me a lot of
information of how to use things easier. There are Essential Links, Cool Tools and more. The
name of this website says clearly that is a school website of GWA in Dubai and it is for MYP and
DP. In the home page which is Secondary News and there is a photo of the principal for MYP
and DP. I like this website because it has a simple background. On the Internet there is a slogan
called K.I.S.S., Keep it simple, stupid. And I really think having a simple background looks
better.
http://gwamypdp.weebly.com/



















This is a website of Tabasco. I really like this website because normally my whole family likes
Tabasco and we use it a lot. I really like that they have some photos of how to use (where to
put) the Tabasco sauce. The photos also move every 5 seconds. There are tabs for different
kinds of Tabasco flavors, recipes and more. I researched about color red and it said that color
red makes you want to eat something! Red induces hunger more than any other. Red attracts
attention, causes excitement.
www.tabasco.com
Design Brief:

According to this survey I found
The survey fillers said that they use Google, YouTube, and websites from teachers. I was
thinking about putting games on the website and most of the survey fillers said it is good to put
games, but not real games like the Quizlet language games. I also think font size 12 is the best
for tabs and writings. For the solution I am going to make a website by using Weebly for GWA
community that teachers, parents, and students can access. I am going to put resources that
help teach you French, which are Conjuguemos, Quizlet and as well as some videos. I have
chosen the color of the website and it is going to be yellow and white mixed and black writing. I
have chosen this color because according to the research, color because yellow helps focus,
study, recall information, and is useful for exams. Also yellow creates enthusiasm for life and
can awake confidence.















Developing Ideas

Design Specifications:
For this problem, I am going to make a website. Parents cant access to your drop box and your
work. You also cant access the Z: Drive at home. Website should have title, tabs, search bar,
photos, and information about how or why the website is made. There is going to be two
different designs and I am going to make a final design. One of the tabs is going to be the
resources and I am going to put Quizlet, Conjugemous, Managebac, YouTube, Google and more.
In homepage there is going to be everything but summarized that are going to be in the tabs.
Under the tabs there will be a graphic of learning language and there is going to be a paragraph
why I made this website and how useful this website will be. This website will be all about
learning French because I am learning French in school.










Design Specification Table:
Title Tabs Graphics Search Bar Logo
Design 1
Design 2


Design Ideas:
Design 1:
















Logo
Website Title
Home Resources French Units Current Unit About



Graphic of word saying I <3 FRENCH




Paragraph about why I
made this website.

Headline
Search Bar:







Design 2:





Home
Resources
French Unit
Current Unit
About



Website Title
Graphic of saying I <3 FRENCH Paragraph about how and
why I made this website
Clock
French:
Verbs:
Conjugations:
Vocabularies:
Expressions:









Key Features:
Title: The title is going to be Learning French Properly. And I chose this title because students
dont learn languages properly or dont know how to learn at school.
Tabs: In tabs there is going to be buttons, which says: Home, Resources, French Units, Current
Unit, Review, and About. In resources there is going to be websites such as Quizlet,
Conjuguemos, Managebac, Google, Google Translate, and other.
Graphic: There is going to be a picture of I <3 French. I just wanted to put that because it makes
me feel happy and makes me I want to learn about it.
Review Box: There are going to be more than that on that design. The review box is going to be
helpful because reviewing is the most important thing to do when you learn about something.
Search Bar: The search bar is going to be on the top of the website, I am not sure where the
search bar could be that would be a good space.
French Units: In French Units there are going to be all the units that we are going to be.
Current Unit: If you click current unit, the website is going to pop up with all the things we
learned with dates on them.
About: I am going to put my email and maybe my phone number for feedbacks.














Final Design:















Website Title
Home Resources French Units Current Unit Review About
Picture saying I <3 FRENCH
Vocabularies:
Verbs:
Expressions:
Conjugations:
Frequency Words:
Colors:
Classroom Words:
Time Phrases:
Rules:
Numbers:
Places:
Clock
Search Bar:






Key Features:
Title: In my final design, the website title is going to be on the top of the website. The title is
going to be Learning French For Beginners. The theme will be yellow and white mix. So the
writings and title will be in black.
Tabs: In tabs there is going to be buttons, which says: Home, Resources, French Units, Current
Unit, Review, and About. In resources there is going to be websites such as Quizlet,
Conjuguemos, Managebac, Google, Google Translate, and other.
Graphic: Then under the tabs there is going to be a photo saying I <3 FRENCH. I just wanted
to put I <3 FRENCH photo to make people happy and excited about learning French.
Review Box: In the review box there are going to be words you need to review after class to
class so you dont forget about them. There is way more words then that and also when the
cursor reaches the review tab; it will immediately come up with sub tabs saying all the words.
Logo: There is going to be a logo with my nickname SJ and next to SJ, there will be a mark for
copyright.
Search Bar: The search bar is very important because if a person came to my website for the
first time and doesnt know where to go, then they can use the search bar to guide themselves
through the website.
French Units: In French units there is going to be every unit (thing) we learned in class. There also is
going to be dates for each event. I will out what the test dates and I will write how much I got for that
test.
Current Unit: For current unit, I am going to write about the unit we are doing right now and all
about it.
About: In this section there is going to be my email for feedbacks and also if somebody needs
to ask something.
Logo









Working Drawings:
In working drawing there will be my plan about where the things will go. This is created my
spider-scribe and it is also going to say what the font size is going to be.
http://www.spiderscribe.net/app/?3ca32c31a5e60aa38bd4799f476f9aea







Creating Solution
Production Plan
Step by Step Plan:
Task: Explanation:
Date: Time
Required:
Make a Weebly
account
Go to www.weebly.com and create an account. April 21
st
,
2014
5minutes
Choose a theme
and makeup a
website address
1. Click +add and choose a theme
2. Type in your address for this website
April 21
st
,
2014
10minutes
Setup your
website
Go to pages and make more tabs and stat writing
what you need to.
April 22
nd
,
2014
15minutes
Collect all the
images and edit
on photo shop
Get photos for the logo. I got the photos of the
beach and I am erasing the white background.
10minutes
Collect more
graphics
I got lot of photos for my logo.
Make a logo
Finished manipulating my logo and I used pink for my
nickname. It is over everything so it stands out more
than anything. I whopped the Eiffel tower and erased
the background. I put some pictures of what I like. I
overlapped some pictures for more realistic and
comic effect.
April 23
rd
,
2014
30minutes
Edit your Website
I put some photos with links in the page resources. April 29
th
,
2014

Finish some other
website pages
and write
information.
I got a photo of basic color mixed and I wrote all the
colors I know in French. I got an idea of making a
Wordle and inserting in the page column.
May 1
st
,
2014

Finish off making
more Wordles
I made more wordless for most of the pages. When I
went to the wordle I didnt like the layout of how it
randomly settled the words out. So I went to the
Photoshop CS5 and I am going to write down the
words on it.
May 7
th
,
2014

Fill out
information for
several pages
I put information for the Numbers page 0 to 100
and 1000. I made another Wordle for the Unit 2
making adjectives.

Make the
numbers bold
I went to my numbers page where all the numbers
are written that I learned. It was kind of complicated
to make the number bold for every single number.
May 11
th
,
2014

Create photo I
love French
I used some photos to help me, but I went on photo
shop to overlap photos and I erased the heart that
was attached with letter i.
May 12
th
,
2014

Finish all the sites
I finished putting photos on the page Resources
and I also added the link so when you click the
picture it goes to the site.
May 15
th
,
2014
2 lesson
Work more on the
page About
I May 16
th
,
2014
a lesson
Work on other
websites
It took a lot of time to do this because I knew I had
lots of pages and I had to work on it a lot.
May 18
th
,
2014
2 lesson
Citatons
I need to change the links to MLA form suing Easybib. May 19
th
,
2014
30minutes
Fill more
information
I worked more on the pages that I have no
information.
May 19
th
,
2014
1 and
lesson
Check everything
what I did
I have checked everything what I did May 20
th
,
2014
10minutes
Publish website
I published my website. May 20
th
,
2014
5 minutes






Gantt Chart:
Task Session
1
2 3 4 5 6 7 8 9 10 11 12 13 14
Get all the
photos

Make a
logo

Finish the
homepage

Put
pictures

Finish
page
resources

Finish all
the sites

Work on
Citations

Look
carefully
and fix
spelling or
capital
mistakes

Step-by-
step plan

Publish
my
website


Final Product:
























Link to my website:
http://learningfrenchforbeginners.weebly.com/


Modifications:
I changed the theme yellow to green. I couldnt find a good theme for yellow. So I thought it
would be till god if I use the green. I didnt know how to put a clock. I didnt want to put a fake
clock that is not working, so I just decided not to put a clock. I didnt know that was hard to
make things how you want. Most of my plans were no use. I putted lots of pages to the review
section. I changed most of the things because Weebly didnt work how I wanted them to be. I
didnt know how to put the photos with links adjacent. So I just put them under each other with
links attached to them. In the current unit page it was twice work for me because our unit
changed when I was working on this. But fortunately I didnt work on it a lot before we finished
the unit. I needed to work on it because we just have started doing unit 5. There were so many
vocabularies than the verbs. So it was unbalanced. I just wrote some list of words for the review
box on the homepage. I used sub tabs to help me. I learned how to make sub tabs by myself! I
was very happy. I could have learned how to put photos or text next to each other by Google or
YouTube. Or also by asking my teacher! It took so much time to finish the review page. If you
directly click on the review page it says to click on the sub tabs and I have so many sub tabs and
also sub tabs of sub tabs. I could have worked more on the spaces because now they seem not
to fit together well. I worked on the vocabularies all yesterday night. I needed to add a new
page on the French Units for unit 4. I have a lot of information on Unit 3. I filled lots of
information looking at my old French notebook and textbooks to help me. I think I did a lot of
work on the review section. In page About, I made a survey for people that come to my
website. They can give me feedbacks. I was going to put a photo of me and write about me, but
I thought I didnt really need to do. My current website is very different from my final plan, but I
think I did my best on the Weebly.





Evaluation
Test:















Evaluation of Design against Specification:

Analyse the results of your survey and describe how your Weebly was successful ,
based on that feedback. Dont give me the answers to your survey and expect me to
analyse themthat is your job! See me if you need help though.




Further improvements:
Describe how your Weebly could have been improved, especially relating to solving the
initial problem you wrote about in the Inquiry and Analysis section.




Impact of the Solution:
In Inquiry and Analysis section, I wrote the design problem. The design problem is that its hard
to share educational resources and communicate learning progress with GWA community.
Nobody can access to your school account if you are not at school. You dont send a copy to
your parents and let them read your work. It could be kind of embarrassing. There are good
resources for kids that learn languages such as Quizlet, Language Perfect, Conjuguemous and
other. But it is hard to control what you need to do on some websites. Some websites could be
all in French and you wouldnt be able to understand if you are a French beginner. So the
solution for this problem was to make a website that everybody can access. I made a website
call Learning French For Beginners
There are good resources like Quizlet, Google translate, or Managebac file to learn
languages. Google Translate is not really good for learning languages because it doesnt have
the correct grammar. Maybe when you want to say I am happy. and it actually could say I
happy. It is hard to go on websites and be on task because when your language B teacher says
to you to go on YouTube and search something, you might go on YouTube for watching movies
or TV shows not on purposely and say to your mom you are doing French homework. If you go
on YouTube you get distracted by the other videos shown on the right side or by the
advertisement I sometimes did that and I didnt know it. You tube is addictive and there are lots
of inappropriate words or videos. When you first go to Quizlet or something you get confused if
the teacher didnt tell you so detailed. You go on Quizlet and you clicked on something and it
shows up to log in. then you roll your eyes then try to make a very hard password. Then you
end up with forgetting the password and need to sign up again. It is hard to get help easily
because when your Arabic teacher says to go on a website and study Arabic the site might be in
Arabic and you would totally lost. The next day you go to your Arabic class and your teacher
asks why you didnt do the homework.
It is hard to share educational resources and communicate learning progress with GWA
community. When your parents or teachers want to see your work, it is hard because teachers
dont have access to the Z: drive. Only you can access your Z: drive but you cant access at home
because the program is not downloaded on your computer. The teacher can access Managebac
if the student submitted its work. Every teachers teaching ways are different. Some will say to
hand the work in paper, submit in Managebac, or put it in S: drive, etc. The other problem is
that if your parents want to see your work but they cant because they dont have access to
Managebac or Google account.









Describe how your Weebly has solved the initial problem you wrote about in the Inquiry
and Analysis section.








Citations:
http://contentmanagementsoftwares.net/webpage_fonts.htm
https://edshelf.com/tool/managebac
https://www.eventbrite.com/e/atx-startup-crawl-2013-presented-by-google-tickets-
7105846779
http://gwamypdp.weebly.com/
http://www.newlook.com/
www.tabasco.com
www.womenworld.org/health/9-colors-will-help-you-feel-better.aspx
http://www.yola.com/blog/what-makes-a-good-website/
http://www.youtube.com/watch?v=0QTlO49G_wg
http://www.youtube.com/watch?v=SwgHfja6BCs
http://www.youtube.com/watch?v=p_g0VfcHJ0Y
http://www.youtube.com/watch?v=wq3-Qd8cCao
www.womenworld.org/health/9-colors-will-help-you-feel-better.aspx
http://www.newlook.com/
http://gwamypdp.weebly.com/
www.tabasco.com



Images:
http://www.mycutegraphics.com/borders/simple-page-border.html
https://gwa.managebac.com/login
http://www.mycutegraphics.com/graphics/summer/beach/bucket-in-the-sand.html
http://www.mycutegraphics.com/graphics/summer/beach/beach-ball.html
http://www.mycutegraphics.com/graphics/summer/palm-tree/palm-tree-on-beach.html
http://www.mycutegraphics.com/backgrounds/plaid/plaid21.html
http://www.wordans.co.uk/i+love+france+designs
http://career-city.com/letter-borders/letter-borders-4
www.wordle.com