CSS Layout and Design For One Page Web Site

  • Статус: Closed
  • Винагорода: $100
  • Надіслані роботи: 18
  • Переможець: princevenkat

Стисле описання конкурсу

The Problem
I have a one page web application that looks blocky and ugly and it needs the attention of a graphic designer skilled in CSS.

The Contest
I am looking for the best redesign for my web application. Designers may modify any HTML, CSS or interface images to create their design.

1. The Theme
This web application is in a conservative domain that people take very seriously. As such, your design should be conservative, corporate, reassuring and safe.

2. Content
* I have obfuscated the labels on the sample form for reasons of disclosure, however the labels are all the same size as the original text.
* I have taken some screen captures of charts produced by HighCharts and used them for spacing in the sample page. You should aim to fit the three charts in a single line on the page.
* The Run button is a simple submit button. Change this to whatever looks cool.
* The input fields are small and difficult to use, you should change this as part of your design.
* You should change any font or color as you see fit to match your design.
* You can change the layout in any way, as long as the site remains a single page.
* Preference will be given to royalty free images over photo stock images. If you use non-royalty free images, you should note them in your entry.

3. Your Contest Entry
I have uploaded all of the HTML, CSS and image files that make up the layout of the site. You should download these files, and modify them accordingly.

Once you have completed your design, take a screen capture of your modified web page and upload the image as your entry. If you have added animations, you can take a video screen capture of your working site and upload that video as your entry.

The winning entry _must_ provide all of the CSS, HTML and image files used to create the screen capture/video. Using Photoshop to modify your entry will result in disqualification.

4. Judging
The winning entry will be the one that most closely expresses the theme of the site, is aesthetically pleasing, and easy to use.

Рекомендовані навички

Відгук роботодавця

“I really appreciated the live website that I could test and tinker with. Could be more responsive, but it was only a small project, so it was OK.”

Зображення профілю iankt68, Australia.

Публічна роз'яснювальна дошка

  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Are you there? Have sent messages in contest handover, but didn't get response from you since last week or so. If all is good, please leave feedback for the work and close it now.

    • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Can you please let me know if its all good and close the contest with feedback? It has been a week since I hear from you.

    • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Did you test the updated files in final.zip ?
    Please close the contest if its all good.

    • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Hi, let me know if there is anything to improve so I can do them and show you.

    • 7 роки(ів) тому
  • ruafridi
    ruafridi
    • 7 роки(ів) тому

    And Is it must to have all the three tabs in one row and charts in the other row... I mean there should be a total of two rows?

    • 7 роки(ів) тому
    1. iankt68
      Організатор конкурсу
      • 7 роки(ів) тому

      No, the only requirement is that it fits on a single page.

      • 7 роки(ів) тому
  • ruafridi
    ruafridi
    • 7 роки(ів) тому

    Check the corrected one at #21 and tell me again what you think.. Have a great day! :)

    • 7 роки(ів) тому
  • iankt68
    Організатор конкурсу
    • 7 роки(ів) тому

    One day left to submit your entries. Some points to keep in mind. (1) The current design is too 'blocky', so make sure you bevel the sharp edges and use soft fonts. (2) Use conservative colors. Greys, soft blues and black for contrast. (3) Be sure to use the labels supplied so I can see how they fit in your design.

    • 7 роки(ів) тому
  • ruafridi
    ruafridi
    • 7 роки(ів) тому

    I am also using JQuery and BootStrap to build it! Is it ok?

    • 7 роки(ів) тому
    1. iankt68
      Організатор конкурсу
      • 7 роки(ів) тому

      Yes, JQuery and BootStrap are OK to use.

      • 7 роки(ів) тому
  • ruafridi
    ruafridi
    • 7 роки(ів) тому

    #17 .. It uses animated Toggles unlike your images one for nicer user experience... It is simple and professional and grid based..

    • 7 роки(ів) тому
  • ruafridi
    ruafridi
    • 7 роки(ів) тому

    Wait for my design but tell me one thing... Do we just have to desing it in HTML and CSS or will we have to add the functionality in future or you will do that yourself?

    • 7 роки(ів) тому
    1. iankt68
      Організатор конкурсу
      • 7 роки(ів) тому

      Just HTML and CSS. All of the functionality is already built. The files posted up here are just a shell that need some design work to make it look good to the eye and easy to use.

      • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Please check updated entry #11 (centered texts)

    • 7 роки(ів) тому
  • tobechukwuikpe
    tobechukwuikpe
    • 7 роки(ів) тому

    I want to work on this but i have a question. Do the toggle on and off have to be included in the final design?

    • 7 роки(ів) тому
    1. iankt68
      Організатор конкурсу
      • 7 роки(ів) тому

      No. The toggle functionality is already working, but there needs to be space for the toggle button. You can just leave it as an image and you don't need to use the images I uploaded, you can use a completely different toggle button, as long as you have images for both "on" and "off".

      • 7 роки(ів) тому
    2. iankt68
      Організатор конкурсу
      • 7 роки(ів) тому

      To be clear. There needs to be a way to enable/disable some of the input fields. How you do that is entirely up to you.

      • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Please check entry #5 and #4 ... HTML CSS files are ready now.

    • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Yes #3 is done in HTML/CSS.
    You can award the contest if you like it.

    • 7 роки(ів) тому
  • sharathnb12345
    sharathnb12345
    • 7 роки(ів) тому

    please check entry #10 css and html are ready

    • 7 роки(ів) тому
  • sharathnb12345
    sharathnb12345
    • 7 роки(ів) тому

    working with bootstrap . and will submit in few hours

    • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Check entry #3 ... hope its alright. Give your comments.

    • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Thanks for the comments. Please check my entry #2 for the updated design.

    • 7 роки(ів) тому
    1. iankt68
      Організатор конкурсу
      • 7 роки(ів) тому

      I think there was a misunderstanding. I have added more comments.

      • 7 роки(ів) тому
  • sharmavn889
    sharmavn889
    • 7 роки(ів) тому

    Have started working on this. Please wait for my entry, will submit in 2-3 hours.

    • 7 роки(ів) тому
    1. iankt68
      Організатор конкурсу
      • 7 роки(ів) тому

      Of course. I look forward to seeing your entry.

      • 7 роки(ів) тому

Більше коментарів

Як організувати конкурс

  • Опублікуйте свій конкурс

    Опублікуйте свій конкурс Швидко та просто

  • Отримайте безліч конкурсних робіт

    Отримайте безліч конкурсних робіт З усього світу

  • Оберіть найкращу роботу

    Оберіть найкращу роботу Завантажуйте файли - це просто!

Опублікувати конкурс зараз або приєднуйтесь до нас вже сьогодні!