Design Layout

I chose the second moodboard and the second wireframe for my website. I started designing the layout by combining the wireframe with the moodboard theme to create an example of what my website would look like on photoshop. I made two three different layouts:

Layout 1:

Layout 2:

Layout 3:

As you can see non of the 3 layout are completed. That’s because I got stuck while designing the layout to the extent that I had to do 3 different ones and I still didn’t get the results I was looking for. They all looked simple and unprofessional, and the colors did not represent the organazition at all. I then decided to change the theme colors and add a textured background and see if it will work. So, here’s my design layout (homepage+interior page) with the new theme colors:

Homepage:

Interior page:

Designing for a Non-Profit Organization

Having a clear, attractive, and an stylish website is one of the most important things for a non-profit organization, especially because they do not have any fixed income to pay advertisement companies for advertisements. However, because non-profit organizations do not have fixed incomes, they usually do not have a high budget to pay for a web designer, and therefore usually have poorly designed websites.

The website I chose to re-design belongs to UAE Down Syndrome Association. UAE Down Syndrome Association is a non-profit organization that spreads awareness by members and volunteers. They highlight the needs of people with Down Syndrome and they try to create an environment to accommodate integration and offer support and encouragement to their families.

UAE DSA’s website clearly shows that it was made in a rush both in design wise and content wise. The colors are too flashy and there are way too many tabs on the left side. Content wise, most of the tabs do not have anything in them or they have “text text text text text…..” written where the actual text should be.

Cabinet of Curiosities

For my cabinet of curiosities, I wanted to display something I’m interested in. So, because my father is a vintage camera collector I thought it would be very interesting to present my father’s camera’s in an interesting way. My first idea was an investigator’s jacket that opens when clicked on and all the camera’s will be hanged inside the jacket. However this wasn’t for easy to illustrated nor photograph. I changed the idea to a more typical cabinet of curiosities; so I arranged the cameras as well as some other objects like camera films, negatives, lenses, and some photographs taken by my father in the 80’s. I added roll-ons on some of the objects like the camera and the film, some pop-up windows, and some click-ons. I illustrated a camera for the home pages which when clicked on takes you to the main page.

Homepage:

Main page:

Unsuccessful Websites

As we all know and may have experienced, there are many website on the internet that have very poor design and layout, I chose a few of these websites to talk about them>

1. First website is a website that is made to help beginners learn how to sew: sew-stich-learn.com

This website is made for people to come and learn basics of sewing, whoever the information on this website is very poor and I thought it is very hard for any person who visit this website to learn how to sew. I  believe this is because the website has a lot of text and very few pictures to demonstrate the steps to sew. In addition to that, the design of the website is very poor; the colors are very bright which might disturb the eye and the font is very basic and very boring. Also, the tabs in the left bar are too much for a website, I think if they start grouping them into categories it will be easier for the website visitor to find what he or she is looking for.

2. The second website is called Artpedia:

When you first hear the name of this website, you will expect a rich website that actually has information about arts all over the world. However when you open this website you will find that all the information they have is in the homepage. As soon as I saw the was all the information was crammed in one page I  instantly lost interest in this website and closed it. But when I actually went through the information, I found that there are a lot of useful information that can be arrange in different pages in this website. The design of the website is really bad, it has a white plain background and the font is very basic. Furthermore, the tabs that are displayed on the top and on the left side of the page are advertisements that are irrelevant to the subject of the website.

Successful Websites

As I surfed through the internet looking for interesting websites that really caught my attention, as well as website that use features such as layout, design, colors…etc. in a very interesting and unique ways, I stumbled on few website that I thought are worth sharing with my readers.

1. This is one of the websites that caught my attention:

It is a website of a web/graphic designer: Melissa Hie. The website has a very sleek modern design. Although the content may be lacking some information, I think it is a great example of a successfully designed website. Being a website of a web/graphic designer, it is very important that the creator sets it as example for future clients. The website is basically made of one page with tabs which leads to different sections in the website. Navigating through this website is very interesting as the section slides to a different section of the webpage. The creator chose to set one color for each page/tab which also go well together. She included a short biography, samples of her work (which if clicked will take you to the real website), and her contact information.

2. The second website I chose to write about in this post is a very twisted website, called Nobody’s Here:

The second website I chose to write about in this post is a very twisted website. As you open then website you see the silhouette illustration of a man sitting in front of his computer with words on the right. As you point your cursor on the words a phrase appears on the left side as if someone is typing it, and if you click on the word it takes you to another page that has a few paragraphs talking about the particular word. For example, if I click on the word “alive”, it takes me to this page:

…and in order to go back to the homepage we have to click on the illustrated “I”.

The reason this website really caught my attention is because at first I had no idea what the website’s main function was, so I started playing around the website and going to different pages and reading what’s written. I believe the person who created this website has a very unique was to attract the attention of the viewer. Even though the website is extremely plain, with a white background, I still found it very interesting.

3. The third website I found interesting is also a portfolio website by the Swiths interactive group:

This website is a portfolio of two young men, one is a web designer/designer/coder and the other one is a programmer. The most interesting aspect of this website is the design; it looks like a desk with papers on it, and if you scroll down to the bottom you will find feet which represent the feet of the person sitting in front of the desk or the viewer. The colors of this website is very light and very easy to the eye. We can see the the website shows that the designer payed attention to some little details like the roll-ons on the buttons or the tabs which takes us to other pages.