The client I work with has undergone an internal branding exercise. The result is that all of their documentation standards have been updated to include a common header. The header contains a black background with an orange electric wave as a prominent design feature.

I've now been asked to incorporate this into their intranet design. Can anyone please provide me with any examples of web design elements incorporating an electric wave? The designs can be either prominent or subtle.

I'm basically struggling to design around this without it looking dated. Any inspiration would be appreciated.

  • 1
    What, exactly, do you mean by an "electric wave"? I'm pretty sure it's not this, even if that's the first thing that came to mind for me. Commented Apr 26, 2013 at 12:14
  • sure, this wallpaper incorporates a very similiar visual: hd.wallpaper-s.biz/wallpapers/electric_wave-1680x1050.jpg Commented Apr 26, 2013 at 13:52
  • 1
    Good and dated are subjective. If you have a specific question of how to execute something or why something is or is not effective we could help you out but what you think is a good use of electric waves and what anyone else thinks is a good use of electric waves could be two very different things.
    – Ryan
    Commented Apr 26, 2013 at 16:50
  • Completely agree with Ryan. As it currently is, this question will probably get voted to be closed. Brian, can you try to edit it so it can be potentially useful for other people?
    – Yisela
    Commented Apr 26, 2013 at 18:54
  • Hi, I realise it's a difficult question to interpret but that comes from the fact that I'm not allowed to reveal the branding asset in question at this time. Ilmari's managed to give me some useful feedback though. Commented Apr 29, 2013 at 15:23

1 Answer 1


It's hard to say much without seeing the specific design, but off the top of my head, I can think of two possible approaches:

  • If the header is meant to stand out from the rest of the design, you might just treat it that way, drawing a clear distinction between the header and the rest of the design. Basically, just treat the header essentially like a solid black bar as far as the rest of the design is concerned.

    For an example, here's a mock header bar based on the wallpaper you linked to:

    Sample image 1

    Hopefully, your actual header design isn't quite that dazzling. Still, you'll note that, even though the bar doesn't match the design of this page in any way, it doesn't clash too badly (even here in the middle of the page), precisely because the high contrast and simple shape set it off from the rest of the page.

  • The other option, for dealing with a design element that would be glaring and incompatible if used on its own, would be to tone it down, neutralize it and try to capture the shape of the element without necessarily including its color scheme. You could even try to work the element subtly into the background, instead of using it overtly.

    As another quick-and-dirty example, here's what I got by taking a piece of the same wallpaper, desaturating and inverting it and playing with the lightness curve:

    Sample image 2

    It's still recognizably the same "wave", but much subtler and less clashing now. You could easily work something like it into the background of your page design.

  • thanks, this is exactly the type of input I was looking for. The marketing department are very stringent on not altering the look and feel of the "dazzling" yet it shouldn't draw attention away from the rest of the site design. I'll have a word with them based on a toned down monochromatic version to see whether that's something they'd be willing to accommodate. Commented Apr 29, 2013 at 15:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.