Designing A Real, Genuine, And Alive Site

Sibyllae posted up some very interesting insights into design recently that definitely hit home with me. I have now viewed over 782 “best of the best” (as they are titled) website and blog designs for CSS. They are all remarkable and well done. Since I am not a designer, I felt lost and out of…

Sibyllae posted up some very interesting insights into design recently that definitely hit home with me.

I have now viewed over 782 “best of the best” (as they are titled) website and blog designs for CSS. They are all remarkable and well done. Since I am not a designer, I felt lost and out of place trying to meet the demands of the constantly evolving array of web standards. I felt frustrated. Then I looked closer and I asked myself the SAME question every time I saw something I liked at first sight, but knew I could not imitate in any way for lack of skills to do it; and the question was: “Let’s just assume you could build something like “this snazzy thing over here”. Can you look at this regularly or daily and work with it? Does it suit your purposes?”

Surprisingly, my answer was NO every time.

This echoes my recent revelations on how I want to be real. Simply put, no matter what cool design layouts I saw out there, none of them connected or resonated with me. Thus in trying to emulate them, I was only putting a mask on myself and not really representing who I really am which in turn resonated this “wrongness” within me. Therefore, I knew that I had to stop trying to emulate others and instead just be myself. Easier said than done. For now, I’ve gone back to my Working Late design that I made for Squarespace (but with a few adjustments to it). I like it but it still really isn’t me, as it’s a little too clean. I definitely liking Sibyllae’s new header image though, as it has a real grittiness and texture to it, something I’d like to add to my own site to give it more of a ‘down to earth’ feeling to it.

And from this I learned that one of the most important things about using the web as a medium for any form of expression is: IDENTIFYING YOUR PURPOSE. So through trial and error I identified the following: I am not selling anything, I am not Apple or Microsoft, and I am not a professional designer seeking work. So what does that mean? That means that I can create and re-create my own personal space as the whim suits me. It is OK if it it’s not perfect and doesn’t validate W3C every page, it is OK that it is not pixel perfect. It is ok to violate (which I probably do and I am sorry), every design principle. WOOHOO! 🙂 Maybe the concept here is not just relevant to creating a personal “space; ie: feeling good about your own means of expression… words to live by in other areas of life?

Totally agree. Even more so, I believe this is applicable to professional designers as well. For example, sure follow the rules for layout and functionality, so that your site is usable and accessible but go crazy with your creative juices and do something different, something risky. That’s my current problem. I keep looking at all of these designs elsewhere and while they are nice, some even beautiful, there is no emotion or feeling to a lot of them. They just feel perfect, polished, and empty. Again as noted above, I want this grittiness and texture to my site (in certain areas) and yet also this defused softness as well (in other areas). So I guess a kind of tao ying yang sort of thing.

Anyways, Sibyllae in researching bad design eventually stumbled across Lings Cars and Ling’s WebSite Advice. I won’t go over the various website advice of Ling (as you can read it yourself) but I will say that I was definitely surprised by a lot of what she said. Not in the sense that I thought it was wacky but in the sense of how much I connected with a lot of what she said at a deeper level. In a nutshell, it’s about stop trying to be perfect and start being yourself. When you do this, people will see you as someone who is genuine and thus can truly connect and trust you. Again a lot of it has to do about the feeling you emanate or resonate to others (i.e. “Talk normally, express emotions.”).

One final thing that I really found interesting is Ling’s advice about creating a site that is “alive”, as I’ve been thinking about this for a while actually. For example, so often people get upset about their sites because their designs are so static and never changing (which is why people, like myself, change them so often). This is nuts because it doesn’t truly represent who we are as individuals. Yes, I can create different moods for different sections of my site but it doesn’t really go as far as I want. Instead the idea is to create a living design that is able to change with your moods, seasons, or even holidays. Two great examples of this would be the various alternating designs within Vox as shown below (Autumn Kyoto Moonlight, Midnight, Setting Sun) as well as Hybridworks (with it’s little ever changing pixel world that you have to see to believe).

So for a Squarespace site, imagine your site design is your layout which has specific visual elements within it that are static. Now within that layout though are a multitude of styles that are applied to these visual elements to resonate a different aspect, emotion, or cycle of your life. So one style could be a happy one, another a sad or reflective one, another could be for Xmas, another for Halloween, and so on. I mean if you really wanted to get crazy, you could even make it seem alive by automating a lot of this via javascript, in that at certain times of the year, your design would change automatically. However in all of these different styles the same visual elements would still be there but just displayed different (i.e. if the static visual element was a house scene, it would show snow outside when using the Xmas style or a night sky with moon and a pumpkin on a window if using the Halloween style).

To be honest though, I’d love to push this down to even the post level. So if I was writing a post at night, in a certain mood, that feeling could be conveyed and carried across when you read the post on my website. Don’t really think this is possible yet though, as you’d have to include those variables within each post somehow. I mean I could encode the CSS within each post but that’d be pretty messy, especially for the longevity and sustainability of the site.

Anyways time to stop, as I’m starting to ramble. All said and done, I’m glad Sibyllae posted her thoughts and discoveries on design because it has definitely given me a lot to think about and potential directions to take with my own site design. Thanks Sibyllae!

By Nollind Whachell

Questing to translate Joseph Campbell's Hero’s Journey into The Player’s Handbook for the roleplaying game called Life, thus making vertical (leadership) development an accessible, epic framework for everyone.

4 replies on “Designing A Real, Genuine, And Alive Site”

Nollind thank you SO much for sharing these thoughts. You elaborated so well what I was trying to articulate. I was trying to wait to comment here because I am assembling a mini "dissertation" on what I encountered in my "observations" project from both an audience perspective and personal perspective (this will include many references and little tips etc. that I found along the way too…. like: how to get that "dotted line" effect off mozilla browser, seeing your site in 27 different browsers etc.) and things that may help those that just want to do their own thing, but are not developers or designers… Also, I will include some comments I shared with professional designers about what I (and others) found that had impact, what did NOT no matter how "cool" something initially appeared.

As for myself, you hit it spot on when you spoke of building something you felt comfortable in. That is EXACTLY where my frustration was. While I have umpteen images that I really LOVE and inspire me, everytime I tried to implement one it just seemed to make things more static (because 3 days later my mood changed). So I (personally) – changed my tactics! I LOVE fonts and feel fonts can express alot of "mood" without locking you in. So I did my own "this is sibyllae here and now" font-only header (thanks for liking it! I thought I would be the only one actually! Which was ok by me… 🙂 — and I used NO GRAPHIC 🙂 Hmph!

The other thing I learned in the process is: I prefer black white and grey. Why? I identified my purpose (in this case, a personal endeavor) and these "non-colors/all colors" worked well (for me, perhaps not others or other purposes). But I am definitely writing about this experience and will let you know when it’s completed, because I learned ALOT. Probably because I am NOT a designer. But for this very reason, explaining about my process might be helpful actually to someone else too.

> seeing your site in 27 different browsers <

Hehe, there are a ton of designers who hate having to deal with cross platform compatibility issues in various web browsers. I think that’s why so many people like Flash because it views the same on all sites. However, the downside is that it breaks a lot of the basic features of the Web and web browsers in the process (i.e. bookmarking any web page).

> I LOVE fonts and feel fonts can express alot of "mood" without locking you in. <

Totally. I’ve actually seen some sites with practically no images on them whatsoever (just CSS text and colors) and they can still relay a lot of feeling to them.

> I prefer black white and grey. Why? I identified my purpose (in this case, a personal endeavor) and these "non-colors/all colors" worked well (for me, perhaps not others or other purposes). <

I’ve noticed this somewhat as well. And from my perspective, I think those color tones are more suitable when a lot of your content itself is colored. Thus the neutral black, white, and grays provide more impact to say a picture of a sunflower, intensifying it even more. Where as if your background was highly colored, it would saturate and detract from the picture of the sunflower.

You are right about the colors and I never saw it that way before. No wonder all those colors I love so much clashed lol! And I think a dark-on-light style is not suitable in alot of instances. But as you said above, it’s how one feels best in any given moment and the purpose. On that, I am STILL trying to hash out all my "thoughts" and got sidetracked. I posted about my new "whiteboard" 🙂 I can’t believe I actually signed up for that but I really feel it may just help me out; a different approach! I can’t tell you how frustrating it has been to try and backtrack the lengthy bookmark lists.

Ah! You’ve discovered Tumblr as well! I’ve been fooling around with it a bit myself and will probably write about it soon. I’ve actually been thinking about this "streams" concept for quite some time now and Rubel is correct in that streams aggregate together to create this river of your life (i.e. lifestream as he puts it).

You’re also dead on that it’s much easier to put snippets of info down, to keep things flowing, at which point you can come back to them later and aggregate these notes into more structured thoughts. It’s basically like having a notebook for little small notes which you eventually piece together and write about in your journal (aka your blog). And course, your thoughts in your journal can then even be put together in an even more structured way to create articles (which can then form the basis of a book).