Squaring the Circle Between Professional & Creative Web Design

[Kallistero]

• What do you think of adding creative & artistic flair to "professional" Web sites?
• If you were in charge of the design for a page or Web application for a business, would you rather play it safe all the way with more mainstream design, or would you try nudging to make it more striking & unique?
• Can you think of cases where a business or professional site managed to "shoot the moon" with a quirky site design that people would come back to BECAUSE of its design?   
• Do you think it could go over well if you had something like a fully personalized & custom Neocities page listed on your Linkedin, to showcase to people in the professional world that this is your vision & your ability?
• Do you believe these two worlds should always remain separate in the bigger picture, or what are the conditions wherein Web Revival rationales could (or even should!) cross over into the business & professional world?   

I've been thinking of things like this, because I'm working on making my own "professional" personal Web site that I can share in a formal setting, like on Linkedin, to showcase work that I've done under my own name. While it's probably generally accepted as good practice to not make your portfolio site look like a MySpace profile, I think having some creative flair can be presented as another showcase of your capabilities, both creative and technical! "Well-designed" portfolio sites tend to still bear most of the trappings of modern mainstream Web design, though, and even when they do something cool & creative (like this site's text mouseover effect or this site's framework-powered DHTML landing & page transitions), it's usually restricted to a couple of nice unique quirks that then go on to supplement an otherwise safe & corporate design 

By contrast, people around these independent Web spaces tend to cut loose a lot more. I get that businesses have good reasons to want code that follows standards of maintainability, scalability, and familiarity to the user, meaning professional sites might want to play along to communicate that they know the game, but even when you look over the bodies of other work from Web designers in that space, they would be daring indeed to show you that they ever made a site that uses a classic or alternative whole-site layout, a just-for-fun motivation, or (heavens forbid) a gif image!    These indie-Web commonalities are seemingly taboo in those spaces, and I'm not sure that they have to be. So I pose the questions above... 

[Gloogo]

I'm not a designer, but I am a web developer by profession and have worked closely with designers. Most designers in the professional world don't have the freedom to make the site exactly how they want in the way they might with a personal site, and designers of large corporate web applications are often valued more for their ability to make cohesive, understandable experiences rather than exciting ones.

That said, I think if you are making something that is "your own", there is almost no reason not to add a greater level of personalization, even if it's something you'd put on LinkedIn! I don't think colleagues or employers would see quirky personal sites in a negative light unless they're filled with opinionated or controversial content.

I don't have my personal site on my LinkedIn, but not because I worry that it would be a red flag, but rather because my personal site is full of content that is useless to an employer; it does almost nothing to showcase my skills as a web developer, and is really just meant for fun. Although, my site is maybe more tame than a lot of neocities-style sites (again, not a designer  ).

Personally, I see nothing wrong with having lots of flair in your own "professional" personal site, especially if the site content promotes your skills in a relevant way.

[Semper]

I like this discussion, and I think it really does depend on the purpose of a professional website. I very recently learned that the Crayola site has a custom cursor that is a crayon on their Colours of the world page. I think that is really cute and fun, even though the rest of the site is pretty standard looking for a company. That whimsy works for a site geared towards a children's art supply.

The issue with coding creative company sites is that most people are not used to interacting with creative sites, and so a creative site could become a perplexing frustration to a potential customer. It is also important to note that a lot of professional/company sites will have more than one person touching it, be it someone in marketing or someone in sales etc, and so the site needs to be very easy to navigate lest the users get lost in the process of trying to find or add important information.

For a professional site run by a single professional, I can imaging that this is more of a possibility. I would like to see more artists in particular embrace creative web design over the standard white squarespace TM portfolios sites. My favourite to visit belongs to Reimena Yee, who through example has been trying to convince other artists to follow their lead in having a blog as well as a personal zone on their professional website.

There are some people who work in webdev who have some fun sites as well, like Sara Joy. Though I can imagine that creativity like this is more allowed if you are working in close proximity to a creative field like illustration or front end web development.

[BlazingCobaltX]

I'm neither a designer nor a web developer, but I have thought about making a personal website in the scenario I end up working as an independent/freelance researcher. Unlikely, but it's a fun scenario to think about. As website design isn't something that is expected from researchers, it would be very fun to add elements that show off that the website is at the very least hand-coded. It would contrast with all the slick sites that function as glorified online resumes.

Though, I do believe there is only so much you can do in creative website design when your goal is selling something: People ultimately need to find their way to your contact form or webshop. It's why all those corporate sites look same-y, too. Creativity is more likely to be in the details that don't take away from the readability of the site, such as colour schemes and box shapes. This does also depends on your audience, of course - tech savvies can handle less intuitive websites a bit better than your grandma. Of course there are sites that challenge this, but i think it makes sense why readability and generic shapes win out in most cases where the goal is to sell a service or website.

But like I said, neither a webdev nor designer, so I could be completely off-mark!

[Kallistero]

I don't have my personal site on my LinkedIn, but not because I worry that it would be a red flag, but rather because my personal site is full of content that is useless to an employer; it does almost nothing to showcase my skills as a web developer, and is really just meant for fun.

You just showed me how my own perspective is coloring how I've been thinking about this 

I like to make my pages & web apps from scratch, messing up until I create something that I've never seen before, learning all sorts of new tricks along the way. The shapes & colors & motions are showcases of things that I didn't know of whenever I first made the site, showcases of things that I had to learn. The fact that it's fairly technically intensive without being a copy of anything communicates a level of self-driven work ethic, creative problem-solving, and understanding that I could reasonably sell to an employer, client, or other business associate. In fact, tricks that I discovered making that site (especially the JavaScript that went into the Effects Maker page) have been useful for data fabrication, UI needs, and custom-configurable process designs that I've employed at my own places of work!

I say that to point out that that's probably not how a great number of people engage with their sites. A creative personal site is often just a collection of things that you enjoy or otherwise want to share, laid out in a way that's pleasing to you. You have full creative freedom to fill out the space with images, to use a site template that suits you, to employ only pre-made scripts, to make it difficult to use, just lots of things that either aren't very useful for a professional or that might be seen as downright frightening to someone who's looking to hire. 

I do take inspiration from these sites, however. The line for a site's professional presentability doesn't exactly seem to be in how creative it is. That suggests to me that a site CAN be for fun, but at some critical mass or density of unique elements, it can also be impressive to the workplace!

The issue with coding creative company sites is that most people are not used to interacting with creative sites, and so a creative site could become a perplexing frustration to a potential customer. It is also important to note that a lot of professional/company sites will have more than one person touching it, be it someone in marketing or someone in sales etc, and so the site needs to be very easy to navigate lest the users get lost in the process of trying to find or add important information.

Though, I do believe there is only so much you can do in creative website design when your goal is selling something: People ultimately need to find their way to your contact form or webshop. It's why all those corporate sites look same-y, too. Creativity is more likely to be in the details that don't take away from the readability of the site, such as colour schemes and box shapes.

The critique of user experience is definitely something I've put some thought into! I even wrote it up in a blog post I was writing last year 

Since then though, this is one of the ideas that I've found challenges for, and that's why, after reading replies here, I was inspired to make the thread on webcraft inspiration from game UI! The idea that sites have to look the same in order to be functional for their users is almost directly challenged by games (including those made for kids or with accessibility in mind) displaying so much creative motion and yet remaining functional for their users. Free-floating images, styles & flair, movement, format & shape, often even elements that serve the same basic function, like skill trees (or business functions like cash shops  ), can look radically different from game to game! It's possible, or even probable, that the lowest common denominator of user is more capable of figuring things out than they've been given credit for by current standards of Web UI/UX. Of course, a business wants it to be navigable, but that doesn't necessarily mean that it has to be such a stickler for the apparent rules of business pages just so a user can navigate it.

Web design may have tricked itself into thinking that the standard bar for Web design is currently well-aligned with this principle of minimal convenience. I suspect that it's gone well beyond the level of convenience that makes a site functional for users, and game UI is a smoking gun for that suspicion 

It is also important to note that a lot of professional/company sites will have more than one person touching it,

I also want to zoom in on this bit. If you continued to read the blog post I linked above, you'll know why. If a website represents any business medium-sized or above, then not only will line-of-business associates like marketing & support be interfacing with your creation, but so will other developers. I stated above that a creative site can be impressive in a professional context if it showcases a diversity or depth of expertise that sets you apart from other designers or developers, but that's fighting with the idea that a professional site should also be maintainable BY those other designers & developers that you stood out from in the first place. That element might be what really keeps a wedge between personal & impersonal sites, is that when you have to pass the site from developer to developer, it adds a further learning curve for that next developer, giving its creativity an inverse relationship with its maintainability 

What I'd really wanted to explore in this thread is how reasons like this for "professional" website design can be overcome by or integrated into with creative decisions in webcraft. For instance, the maintainability concern might be addressed by a styling framework that encourages developers to play around with shapes, motions, and colors, like Bootstrap but with lots of fun, silly, and maybe retro element stylings. Maybe it could also be addressed by having a site that stands out so much that even in spite of the expertise needed to maintain it, it's a good business decision to keep it creative. And like I stated above, maybe some reasons for professional Web design have overshot their mark and can already afford to be a little more creative in spite of everything! 

It's an intersection of ideas that's seemingly under-explored, if only because it can yuck your yum in either direction. It can be a little finnicky to find where these worlds can mesh. However, if the wider culture is in a place where they're asking for reasons why, we in independent webcraft communities are in a unique position to provide not only well-defined reasons, but also concrete movement & ideation toward potential alternatives.

[Semper]

The idea that sites have to look the same in order to be functional for their users is almost directly challenged by games (including those made for kids or with accessibility in mind) displaying so much creative motion and yet remaining functional for their users. Free-floating images, styles & flair, movement, format & shape, often even elements that serve the same basic function, like skill trees (or business functions like cash shops  ), can look radically different from game to game!

Although I can appreciate the comparison, I think it is worth noting that games and websites are not the same thing. A majority of people approach games with the understanding that they will have to learn its new layouts, styles, and aesthetics in order to enjoy their experience with it. When I play a new game I am primed to interact with it either through a manual or an in game tutorial to guide me through the first steps. This is not the standard with a professional website, and in particular an online shop. There are certainly professional websites that follow unique aesthetics though, I will note Peow2's new site, which has a lot of flair and interesting interactive elements, but in this case it's for a fairly small publisher. Smaller companies can be a bit more playful with their designs than larger ones for sure, and a few of them are making that effort.

If you continued to read the blog post I linked above, you'll know why.

I am confused by the chronology of this statement. You shared your blog post after I had made my comment. Was I expected to have this read before I commented in this thread in the first place? I do not see it linked anywhere besides your reply to me. I did end up reading it after the fact. I look forward to when you finish it so I can grasp your full argument.

[Kallistero]

Although I can appreciate the comparison, I think it is worth noting that games and websites are not the same thing. A majority of people approach games with the understanding that they will have to learn its new layouts, styles, and aesthetics in order to enjoy their experience with it. When I play a new game I am primed to interact with it either through a manual or an in game tutorial to guide me through the first steps. This is not the standard with a professional website, and in particular an online shop.

Yes, one of the chief differences with game UI and websites from a user perspective is that a lot of user interface elements only make sense in the context of that particular game! Things that are non-standard need a tutorial or corresponding game element until they become standard, which was the case with Ratchet & Clank's "quick select" system and the "quicksave" feature from Oddworld: Abe's Exoddus. 

However, things that ARE standard to a UI don't often come with any tutorial. Pause menus have super-standard navigation choices in "Unpause," "Options," and "Exit," which bear no explanation to the player because a tutorial on these choices more often stands to get in the way when players already interact with them so many times. There's even a standard way of representing them, as a simple list of text items or boxes. With this collective understanding has come evolution for pause menu UI. People can understand the standard options even if they're arranged differently, even if they use symbols instead of words, if the options move around when you select them, if they include other options like "Restart" or "Save," if there are menu tabs that are more specific to that game. Websites also have those standard & super-standard options, like the homepage, the contact section, or a search function.

As such, the evolution seen in game UI is also partially present in modern Web UI, especially following the mobile era of skeuomorphism! The house representing the homepage, the magnifying glass representing search, the shopping cart representing itself, the hamburger representing an accordion menu, these don't always sit in the same position on a page or may sit in multiple places at once, but people will know what they mean just by seeing the symbol. This allots a potential extra degree creative control without compromising understandability.

Even to your point with multi-element constructs like an online shop product listing, this can be presented in alternative formats that people still understand, like if it was presented the way that operating systems represent file system directories or the way that physical shops keep items in aisles & shelves. People have built-in understanding that isn't often explored too much in Web design, and it probably has less to do with user understanding and more to do with the available tools & maintainability for alternative interfaces 

I am confused by the chronology of this statement. You shared your blog post after I had made my comment.

That's just a way that some people will engage with a link. If someone is referencing something, you might click the link to understand the reference, then get back to the thing that was referencing it before reading onward. It's an adaptation I've made for understanding the veracity of statements in news media, I'm afraid, since it's harder to take an unfair narrativization if you read the source that they're trying to characterize    So if you clicked the link while reading, it makes sense, and if you clicked the link afterward, it doesn't!