[PROJECT COMPLETE] Due July 16th - New Trendics Home Page (PSD Only) - $450

[trendics]

Admin code added by Abby - 96M06494EK119304B

Company Details

1a) Name of Company

RealMetrics, LLC

1b)Company Tag Line or slogan:

Uptime Assurance

1c) Do you have a company logo?

Yes, in the upper left of http://www.trendics.com.

1d) Do you have a corporate visual identity (a customized (non stock) logo and color scheme carried out throughout your office, stationery, business cards, etc.)?

Yes.

1e) What is the nature of your business?: Briefly describe your products or services:

We provide server monitoring solution for website owners and server administrators. We monitor a user's websites and servers from our 10 monitoring servers and send the user alerts via phone, email, IM, and SMS if there is a problem with their website / server.

1f) Who is your target market? Who are you hoping to reach with your site?

Website owners and server administrators.


Website Details

1b) Do you have an existing website? If so, what is the URL?

Yes, http://www.trendics.com.

2b) IMPORTANT: Please list at least 3 URLs (web addresses) of high quality sites that you like the look of (these do not have to be sites who’s business is similar to yours. It aids us in determining what your design style is.) Please consider layout, colors, navigation, graphics, and typography.

http://www.odesk.com/w/ (super clear message, instantly intuitive)
http://wufoo.com/ (bold colors, clear message, unique style)
http://www.opendns.com/ (simple, clean design)

3b) What colors or color schemes would you like?

I'm ok with the current color scheme although I'm open to other color schemes that still work with the current logo.

4b) List the Navigation links for your Site:

- Home
- Benefits
- Features
- Pricing
- Blog
- Tools
- My Account
- Signup Free Now

5b) What type of look are you trying to achieve? (e.g. clean, high-tech, conservative, warm, flashy, etc.)

Innovative, easy to use product, clean

6b) Please provide the addresses of competitors' sites, if possible:

http://www.pingdom.com
http://www.alertsite.com
http://www.alertra.com
http://www.wormly.com

7b) Do you have any images for use in the design of your site? If not, do you have images, can you offer suggestions of what you type of imagery you feel would be most suitable for your website:

No, more details on our goals and suggestions below.

Deadlines and Deliverables

1c) What is the deadline for your template design?

Would prefer within 7 days -- some flexibility.

2c) Will you require HTML coding? (Yes/No)

No.

3c) If so, will you require it to be ONLY CSS layout? (Yes/No --- {fees (http://www.designoutpost.com/forums/../pricelist.htm)})

No

4c) How many pages coded will you require delivered? ({fees (http://www.designoutpost.com/forums/../pricelist.htm)})

1

Are there any other comments/specific ideas we should keep in mind while designing your project?

The overall goal of the home page should be to improve conversions of visitors to customers (or at least visitors to free signups).

This is what we'd like to have on the home page...

1) Initial h1 tag text with "Server Monitoring" keywords (for SEO benefit and provide short clear description)

2) Three big sections stacked across horizontally with combination of graphics and words to communciate the following three key concepts (much like http://www.odesk.com/w/).

Monitor your website and servers from our 10 independent locations and from agent software installed on your server (optional).
Receive alerts via phone, email, IM, and SMS when your websites and servers have problems.
Troubleshoot and resolve website and server problems quickly via phone, email, IM, and SMS.3) Ideally the text could be minimized in the three sections above by providing effective graphics to communicate each concept.

4) Signup Form (primary call to action)

5) Alert Guarantee & Satisfaction Guarantee (create trust)

6) Website Speed and Multi-Location Trace Route Forms (sticky feature and link bait for SEO)

7) Available in Free and Paid Editions (free is an effective hook)

8) Weekly news blurb (keep site looking fresh)

Not all the sections above have the same importance -- I'm imagining the majority of the home page dedicated to the three big sections listed in #2 above.

Generally, I'd like to have plenty of white space and keep the fonts larger. Must be SEO friendly as well.

[hjalmar]

Hey!

I know i overlooked some of the key points in your list(worked around your old content for now) but i thought i'll get this going and start getting some feedback. :D

Browser Preview: edit

Thanks,
Hjalmar

[Helena]

Hello
I'm working on concept

[Helena]

Hello
please check my concept and let me know if you want to change or improve anything

[trendics]

Thanks for the design, hjalmar. Unfortunately, I'm not liking this design on several levels...

1) The icon design for the three major sections is weak -- they just look like clipart

2) There is no definition to your sections -- all the sections seem to blur together

3) The light blue color scheme is lighter than I'd prefer

4) There is too much text on the page still. I'd like to have a simpler home page.

[hjalmar]

Thanks for the design, hjalmar. Unfortunately, I'm not liking this design on several levels...

1) The icon design for the three major sections is weak -- they just look like clipart

2) There is no definition to your sections -- all the sections seem to blur together

3) The light blue color scheme is lighter than I'd prefer

4) There is too much text on the page still. I'd like to have a simpler home page.

Thanks for the feedback, But I do not have the time to enter with a new design.

Best of luck and i hope you will find what you are looking for.

Regards,
Hjalmar

[trendics]

Thanks for the design, Helena. This may be a workable starting point. There are a couple of big issues...

1) The key call to action (signing up) is not as prominent as it needs to be

2) I really want a much simpler home page -- we need to reduce the text quite a bit

So, I think I'd make these changes to your design...

1) In the blue marquee area, add a large Signup Free Now button to the right of the marquee text and remove the signup form from the home page (perhaps use orange for the Signup Free Now button).

2) Simplify the marquee text to just "Reduce server downtime with our innovative server monitoring solution"

3) Simplify the first marquee point text to just "Monitoring from 10 independent locations and optionally from your server." Currently, all our monitoring servers are located in the US -- the current icon is probably misleading although I might live with that as I'm guessing a US shaped icon will not look great.

4) Simplify the second marquee point text to just "Receive alerts wherever you go when your servers have problems". This icon seems cluttered -- I think it would be better to have a semi circle of email, Yahoo IM, Gtalk, MSN IM, AIM, ICQ, and phone mini-icons that have an arrow into a central person icon.

5) Simplify the third marquee point text to just "Resolve problems quickly by executing remote actions wherever you go". This icon seems cluttered -- I think it would be better to have a semi circle of email, Yahoo IM, Gtalk, MSN IM, AIM, ICQ, and phone mini-icons that have an arrow into a central server icon.

With the changes above, the signup form at the bottom can be removed. The news section is also much too big on the home page -- I just need room for a single blurb. Perhaps the whole content area in the current design could be replaced with some horizontally stacked boxes with this content...

Guarantees
-----------
- Alert Guarantee - Guaranteed to receive alerts each incident and receive zero false alerts.

- Money Back Guarantee - 100% satisfaction guarantee with our Pro Edition.

Free Tools
----------
- Website Speed Check - Check the speed of your website now.
- Multi-Location Trace Route - Perform a track route from our 10 monitoring servers now.

More Info
------
- Benefits - Features
- Compare - Examples
- Demo - Quotes

Editions
-------
- Free Edition - Perform up to 5 checks free, no time limit, .
- Pro Edition - Perform more checks, more frequent checks, and get phone alerts.

News
-----
- 7/10 - Launched Aggregate Alerts. Now receive a single notification with multiple alerts.

[Anne]

Here is my entry

Anne

[Kogar]

Hello,

Here is something from me. I realize you shortened the text but my design can hold the complete description if needed.

Regards

[Anne]

and another version

[Helena]

Thanks for quick comments and please check revision

[trendics]

Thanks for the design, Kogar. I'm a bit conflicted on your design.

While I like the visual look of the three colors for the three sections, I think the three colors make it look too much like we are talking about three different products.

While I like the glassy style of your icons, I don't think your icons do enough to communcate the three key concepts.

I'm not really digging how the three sections and signup button overlap the header.

[trendics]

Hi, Anne. Thanks for submitting two alternative designs. Of your two submitted alternatives, I prefer the second one with the blue sections and I'll provide feedback below on your second alternative.

Your design looks like it has two headers -- the black header from our site and the blue navigation header -- seems like we just need one header.

Your icons do not communicate the key concept well enough. The first icon should really communicate we monitor your site from many locations. The second icon should communicate we have extensive options to alert you (phone, email, Yahoo IM, MSN IM, AOL IM, ICQ, Gtalk, and SMS). The third icon should communicate we allow users to correct problems wherever they are.

I'm not sure I want tabs integrated into the home page like the bottom half of your design. I think I want people to be able to skim the page for key information without clicking to navigate thru tabs.

I think this is the key content I'd like for the bottom of the page...

Guarantees
-----------
- Alert Guarantee - Guaranteed to receive alerts each incident and receive zero false alerts.

- Money Back Guarantee - 100% satisfaction guarantee with our Pro Edition.

Free Tools
----------
- Website Speed Check - Check the speed of your website now.

- Multi-Location Trace Route - Perform a track route from our 10 monitoring servers now.

Editions
-------
- Free Edition - Perform up to 5 checks free, no time limit, .
- Pro Edition - Perform more checks, more frequent checks, and get phone alerts.

News
-----
- 7/10 - Launched Aggregate Alerts. Now receive a single notification with multiple alerts.

[trendics]

Hi, Helena. Thanks for the revised design. I do like this better. I'd still make a few more tweaks to this design...

1) The marquee font needs to be a heavier font and needs to be better anti-aliased against the background

2) The Signup Free Now button doesn't quite look right. I'd probably try a version raised without underlined text and a heavier font.

3) The marquee text and Signup Free Now button visually look a little out of whack. The Signup Free Now button seems out of alignment with the section below it visually.

4) The icon design for the 2nd and 3rd sections is much better; however, I'd find a better email icon and replace the desktop phone icon with a mobile phone icon. In addition, I'd probably try thin white lines from the smaller icons to the central icons. If needed, we could make the whole icon 10% bigger to make this detail easier to see.

5) I'd probably like to see an alternative that adds a bit more definition to the bottom 5 sections. I think we can design this for 6 sections (2 rows of 3 columns) and I'll experiment with the right content for the 6 sections.

6) For now, let's replace the ugly More Info section with an "Examples" section with this content...

- Single Server Example - Setup a single HTTP Connection test with Uptime and Latency alerts.

- Multi-Server Example - Setup two web servers, a mail server, and a database server with appropriate tests and alerts.

7) To fill out the 6th sections in the lower right, let's just add a Featured Quote with one of the quotes from our current home page.

8) I'd probably drop the faded logo in the footer.

[Helena]

Please check revision for design

[Fabian]

Image removed

[Kogar]

Thank you for the feedback. Here is a revised version.

I can change the icons to whatever suits your need if you like the direction of the design.

Regards

[trendics]

I'm going to select a designer tonight at 10:00pm or so (CST).

[Anne]

Thank you for the feedback. Here is the revision.

Regards
Anne

[trendics]

Thanks to everyone that submitted designs -- there were at least three designs that I could have made work; however, I've decided to move forward with the design from Helena.

[trendics]

Doh, sorry, I posted the wrong name, I meant to choose Anne's design from post #19. Very sorry about the confusion.

Helena, your design was good but I think Anne's design is a better fit.

[trendics]

Hi, Anne. I thought this thread would get moved to the Revisions area but maybe not.

Here are the revisions I'd like to see...

1) The white text washes out a bit on the blue nav bar and the three blue sections - can we try darkening the blue *slightly* to better contrast with the white text?

2) Same with the orange button, I'd probably darken the orange button a bit to better contrast with the white text on it

3) I'm guessing that the mini-icon above the ICQ icon in the middle graphic is intended to be a Gtalk icon. Can we change this to be something like http://vamsee321.googlepages.com/gtalk.jpg (not that exact graphic but something like that)? I simply can't tell what the current mini-icon is.

4) The third graphic seems redundant with the first graphic and the section is not having the impact I'd like. So, I'd like to try this for the third section...

"Help us build a community holding hosting providers accountable" with a graphic emphasizing community (imagining a glassy three iconic persons)

5) I'd probably prefer a *slightly* bigger rounding radius on the corners of the three section boxes and on the Signup Free Now button -- our logo has more rounded corners and this would probably be more consistent

Thanks

[Lori]

Congratulations Anne :tup: - nice design!
I have moved this to revisions where you can finish up.

[Anne]

Wow, thank you for choosing my design. I'll get to the revision right away.

Anne

[Anne]

Hi

Here is the revision.

I am having problems finding the exact icons you want. All icons used in this design can be fount at www.iconfinder.net.

Regards
Anne

[trendics]

Great, we are very close.

1) I like the slightly darker blue and slightly darker orange -- the text is easier to read and less washed out

2) I like the additional rounding of the blue sections and orange button.

3) The Gtalk icon is fine now.

So, those three items are done. I'm not digging that last graphic. I had something like this in mind...

http://www.iconfinder.net/index.php?q=people&page=icondetails&iconid=717&size=128&q=people&s12=on&s16=on&s22=on&s32=on&s48=on&s64=on&s128=on

although I was thinking about 3 iconic persons instead of 2 iconic persons (perhaps the 3rd uses our greenish color).

After we complete this, I'd like to have the PSD (although I don't have Photoshop) and I'd like to begin converting this graphic to HTML.

As a first pass at converting to HTML, I'd like to use regular text layered on top of the graphics in most places so I'll just need the background images for these...

1) Background image for blue nav bar (I can probably create that one myself)

2) Background image for each of three blue sections including main icon and reflection below it

3) Background image for the orange button

Also, how can I reach you in the future if we need changes down the road?

[Anne]

How is this for the icon?

Once the files are ready I'll send it to you together with my email address.

Anne

[trendics]

OK, I'm guessing these are final revisions...

1) The green guy seems a bit more washed out that the blue and orange guys -- can you make him a bit more vibrant. He also seems more squished into the blue guy than the orange guy -- can you move the green guy left a bit as well (perhaps shrinking the whole graphic if it gets too close to the text)?

2) Can we make all three graphics have a subtle reflections underneath like the people in the middle icon? So, can you add a subtle reflection beneath the world icon, beneath the persons icon, and perhaps even beneath the AIM / ICQ mini-icons?

[Anne]

How is this?

[trendics]

Perfect. Please send me the background images and the PSD -- you can email me directly at kent@trendics.com.

[Anne]

Files sent to you email address :)

Anne

[trendics]

This project is completed and I'm very happy with the result.

Anne, I've attempted to implement this in HTML at http://www-beta.trendics.com/ -- the layout is a bit better under Firefox as IE as bit different spacing of things.

Any feedback on the final version?

[Anne]

No, looks good to me.

Anne

[BlueCherryGraphics]

PROJECT UPDATE: moved to archives