PDA

View Full Version : Website update


Shadow
03-18-2011, 12:19 PM
Ok, so I'm planning on reworking the website (http://www.soldak.com/) a little bit. For the most part I like how it works from a functional standpoint, so I'm not likely to change much in that regard. What I want to focus on is making it look nicer and more professional. Since you guys are my audience, I would like you input. What do you think would make it look better?

Here's a screenshot (http://www.soldak.com/images/screenshots/website_2011_3_18.jpg) of what it looked like when I wrote this just in case I have changed anything already.

ebarstad
03-18-2011, 01:26 PM
I would say go with large, stylistic concept art in the background. In the foreground, keep a dark colour scheme (not black) -- maybe use a leather texture on which to place the text.

Stay away from Flash -- too many game sites use Flash, which doesn't work on mobile devices (I like to view your site on my iPad).

After looking around a bit, it looks like I just described the Diablo III site. D'oh! But you get the idea.

torikamal
03-19-2011, 01:57 PM
This one looks pretty slick:
http://www.thesecretworld.com/

But definitely keep the functionality of the current site. I hate it when websites get all big and crazy and you sit there waiting for something to load.

Shadow
03-19-2011, 07:01 PM
Ok, some of the first changes are done. These were mostly just minor changes, but what do you all think so far? If you are still seeing gold lines, hit the reload/refresh button in your browser.

DeathKnight1728
03-20-2011, 01:08 AM
It stands out much more than before :)

Bluddy
03-20-2011, 03:40 PM
The buttons look much better. The rest of the golden rimmed buttons should go too.

I suggest putting your best graphics on the first page. The image of the human and lumen doesn't feel strong enough, especially because people who don't know the lumen might think it's some weird japanese kabuki character. Honestly I initially thought the lumen were just low quality art.

An image of some of the fearsome looking characters from DC or DoP would be really good -- something fiery and demonic looking. Even better if it's blasting a hapless hero.

Each game's page should have some graphics (not much) available right away, so it doesn't look anonymous. The graphics should be enough to distinguish between the games -- I don't think the logos (as cool as they are) are enough. Also, the most impressive logo is (IMO) kivi, and that's not the game you want to push people towards first. Maybe you should add ("a casual hack n' slash" to the bottom of the logo. This is a general problem with the logos as they are right now. DC is too small and narrow.

I really think, as I said before, that excerpts from reviews should be in large print as the first thing on the page. "Get this game. Get it now. Get it. Just get it." - Rock Paper Scissors (or whatever the exact quote is) should be the first thing you see, with a link to the review. Then the description should follow, with the embedded video off to the side.

Maledictus
03-20-2011, 07:40 PM
Being a developer and web-site/shop maintainer myself I feel I'm allowed to chip in here, though you may find it a load of BS.

I personally do not believe in flashy websites. I know a bit about how people observe websites and things like speed and 'how to get to where I need to be' rate much higher than graphics do (unless you're part of the teenage iPhone brigade). Obviously you need to project a professional feel, but that is not achieved by flickering buttons and animations. In this particular case it's the products that pull in the people, and the website is the means to an end in getting info and games to the people. Most people that end up getting the game will have info on the game long before they see the website, so the site is the final step towards getting the game. As such it should be neat and clean, responsive, easy to navigate, and project your commitment to the game and to the people playing it (contact with the fans is a huge plus here). As far as I'm concerned it already does most of that now, but I understand your need to 'make things better'; I feel the same way.

An earlier post had a link to a particularly 'professional' (I say this with a hint of sarcasm) web-site and I don't believe that's the way you should be headed. If you stick to simple and clean, and make sure the atmosphere and soul of the games is reflected in the site (as mentioned earlier) you'll do fine.

Having said all this I do like the newer subtle look of things. As said, perhaps the somewhat crude gold rims of the left and right vertical button rows could use some touching up. Bigger and/or better impacting logos could make the game pages stand out more. Using more artwork from the games in the game pages somehow might spice things up a bit.

Using quotes ("but Mike, this is the best thing I've seen since sliced bread") on leading pages tends to be perceived as contrived and cheap, a better way would be to start a testimonial page and put links to reviews there. You already do this, so that's great. And yes, perhaps a mention of the good reception of a game on that game's page, including a link to a review, could work.

Finally, the usual suspects. Spelling and grammar (all your base are belong to us, anyone?) have a far greater effect than people think. Text spacing (no wall of text) and font choice (a sans serif type is easier on the eyes, especially when reading large pieces of text, though personal taste has something to do with it) play a part too. Make sure these simple things are okay.

So, in short, I think what you have now is good for what it needs to do. I tend to look at it like this: you are an indie developer and I come here to buy a game that is firmly rooted in indie philosophy. As such I don't expect a flashy website, I expect the things I wrote about in the text above. Obviously I can not be taken as an example for everyone out there, but I think I'm ... not entirely wrong.

Tip: using google analytics can help you gain insight in visitor behavior.

Crisses
03-20-2011, 07:53 PM
I'm a webdev too, and I'm on Maledictus' side on the "Not flashy!" more content-driven. It's more attractive to the search engines anyway.

Here's what I've said before, and I'll say it again. HIGHLIGHT THE DEMOS. Your games are addicting. What is the goal of the website? What is the goal of the individual product pages? Thankfully on this website, I think it should be the same on all the pages:

It should be "Get them to try the demo." (just vary which demo according to which page they're on.

A direct link to the demo, front & center, on every page. A top-menu link to a page that has ALL the demos in series from Din's Curse/Demon War down....

In our modern ADHD society, people don't like to click. Make it so dumb-easy to find and download a demo they almost do it by mistake! They ended up on the site. The images & text are supplementary, and mostly there for those of us who are reluctant to even try something before we know SOMETHING about it.

Next: get in the ideal customer's head. You're not selling features: you're selling benefits. On this count, we can help Shadow best by "What EXACTLY do you GET from playing Din's Curse (or the others)?"

I get a surprisingly challenging game, tremendous replay value, fun to tinker with on the front & back-end.

Next?

torikamal
03-20-2011, 11:12 PM
http://www.amnesiagame.com/#main

Here's one more site that has some good take aways. It's actually a little bit ugly, but it does give some atmosphere while at the same time being very obvious as to where the links take you and doing a relatively good job of imparting information.

I should add that while the http://www.thesecretworld.com/ website has an unnecessary spinner on it, the aesthetic choices work very well in bringing out the atmosphere and being pleasing to the eye. It also does a great job of intuitively pushing you towards clicks/links without hitting you over the head with them.
For me it's a good balance of usability, speed, and candy.

Bluddy
03-21-2011, 05:50 AM
I mostly agree with what's been said above. I don't think using quotes is cheap though. It's true that people who read good reviews will already download the demo and buy the game -- that's not who the website is for (IMO). They've already been convinced to buy. People who already know there's something good to find here will find it regardless.

The website should do its best to attract the average customer who knows nothing about Soldak, and as Crisses said, to get him to try the demo. To do this, you have to fight the increasingly short attention span of people nowadays, and the preconception that an unknown game by an unknown company couldn't possibly be good. You need to present the best face of the game (some cool graphics -- just a little), have a large, appealing logo, tell what the game does best as fast as possible, and show the potential customer that even though he's never heard of you, important review sites really like your games. Video really helps with showing that even though the customer never heard of the game, it looks and plays well. All of these factors may help the customer decide to download the demo. I do agree the demo should be front and center. As I related previously, I know from personal experience that customers don't bother to click on different pages -- I'd been to Soldak's page 3 times before I bothered to download the demo (and then only because of Tom Chick's review).

I'd probably arrange the buttons at the top according to the order you want people to find them: DC first, then DoP, then Kivi.

In terms of graphics per game, DoP could probably use an image of a barbarian smashing a monster of some sort. DC could have an image of a demon attacking a human NPC cowering in fear.

I like the combined logo for DoP, DC and Kivi on the first page. It conveys the idea that they're all part of the DoP universe. It could probably be wider though, and Kivi should be smaller while the DC logo should be wider.

As a side point, do enough people buy Kivi to justify keeping the multiplayer a separate addon? It might be better to integrate them together to make the package more attractive, or to make note of the fact that you get a free bonus when buying Kivi in the form of the multiplayer expansion. Also, I think having a multiplayer expansion doesn't help Soldak's other products. People expect multiplayer to be a basic part of the game nowadays. I understand that it was a major effort to integrate multiplayer into Kivi at the time, but now that it's done, it's a basic feature. Should a customer happen to read on the main page that Kivi's expansion only adds multiplayer, she might reason that DC's expansion is probably just as minor (which it clearly isn't).

Bluddy
03-22-2011, 01:04 PM
Nice work on the site! It's already looking much better.

Amberjoy
03-22-2011, 03:58 PM
Nice work on the site! It's already looking much better.

I agree. Been too sick to notice what's been going on. :(

Maledictus
03-22-2011, 05:23 PM
+1 appreciation. Excellent.

torikamal
03-22-2011, 07:13 PM
Those buttons look good and having the graphics in the background helps to make everything else pop a little more.

Bluddy
03-23-2011, 06:31 PM
Advice as of right now: the logos at the top need to be centered.

Also, a little graphic on each game page will do wonders. Not much, just 1 or 2 pics. I love going to the monster pages as the combination of text and pics is very appealing. There could be a monster on the DC page, one on the DoP page, and one on Kivi. Or a barbarian on the DoP page. Basically the best art is art from the game or the game models (just like the background). It's bright and pretty.

forevernomad
03-24-2011, 10:22 AM
Website is starting to look really good, couple of things possibly and I realise that this is a work in progress so you probably have thought about much of this.

I think you need to decide why a user visits your home page and what you want them to do, so you probably need to go full DC as the main motivator seeing as it is probably your major game atm.

You need a demo video on the home page for DC, seeing as its the newest, possibly something rendered with first person camera angles to get a feel for the environment/game system and not just gameplay footage. I'm sure there are users who would be willing to film some stuff, especially if you create a couple of mods that shift the camera to capture that intense moment.

The background image is great but you can't see it, you should add a full screen image, perhaps a massive header with the embedded video/scroller (see below) and a full page surround image to show off your games.

The title images at the top need to be reorganised to show off DC as the current game with the other two having a smaller footprint, atm DEPTHS of PERIL looks like the name of the site.

The main navigation bar doesn't gel with the rest of the image styles, maybe you could use some of the styles from the DC UI instead.

Content headings being the same colour as the game they belong to, so purple heading text on the DC page.

Bigger, high quality images replacing the smaller, low res versions

Better font choice, css can use any font whether the user has it or not so you can use some really nice custom fonts for headings/content.

Get some interactivity on the site, jQuery is simple and awesome, so perhaps instead of a home page video you can have a nice scroller, one on every page for each game, with screens and gameplay features.

That's all for now, keep up the good work.

And yes I am a web developer ;)

Bluddy
03-24-2011, 11:37 AM
I'm going to disagree with you on one thing, forevernomad. When I saw your advice, I suspected that big background images would be too distracting. Now that Shadow implemented it on the DC page, I think my hunch was right. There's too much happening in the background to focus properly. The thing I liked about the previous background image was that because it was small and not fully visible, it didn't distract much. I'm NOT a web dev, so I don't know what's usually done for background, but I do know that huge background images went out of fashion a while ago for this reason. Looking at some other game sites, it looks like they use gradients or something with soft colors. Shadow, maybe you can take the image you're using now and turn it sepia in Gimp 2.0 or some other image manipulator (it's a simple function). That would take away the overly distracting colors, allowing focus to rest on the important stuff, while still maintaining the interesting image in the background.

I really like how everything else is shaping up though. Good call on the row of buttons needing to match the same style -- it looks great.

EDIT: here's an example (http://dl.dropbox.com/u/22120175/Din%27s%20Curse/backgroundDin3.jpg)

forevernomad
03-24-2011, 12:02 PM
The reason I mentioned the background image is because you can't tell it's an image as it is hidden behind the content area, but if you view the background image as it is, it's very faded and nicely done, it's just that it is hidden, I wasn't thinking drop a full colour screenshot on the site, that would be leary, and as you say that went out a while back, in fact the only time you see that kind of thing is when its an ad, so we tend to ignore them by instinct.

edit: ninja'd but here's the current background background (http://www.soldak.com/images/backgrounds/backgroundDin1a.jpg)

PixelLord
03-24-2011, 01:30 PM
The background images are in a state of flux as we are still working on them. The old image that's mostly blocked was originally intended to be seen with the text on top (an experiment), but that might make the text less readable; so Shadow went with keeping the black boxed area. The old graphic will be replaced. I agree that the current DC backdrop is a bit too bright and colorful (distracting), so we may try a slightly darker, more monochromatic image that better matches the page's color scheme.

I really like a lot of the suggestions made by forevernomad and others. Thanks and keep them coming! We want a site you'll all like. :)

Roswitha
03-24-2011, 08:24 PM
Can you brighten the font a bit? The grey on black is a little hard to read.

I find this link (http://hans.fugal.net/vim/rgbtxt.html) useful when working on webpages.

Bluddy
03-25-2011, 04:40 AM
Wow really nice with those pretty per game images -- it's better than anything I imagined. I can tell the site is much more effective now since it makes me want to give Kivi another try :) Seriously the effect cannot be overestimated.

One thing I think may be worthwhile is making a bigger, wider version of the Din's Curse logo. The other logos are bigger and more impressive. Depths of Peril may also be a little too wide, with a font that's a little too big in comparison to the others.

BTW Depths of Peril is the only game whose name and logo really doesn't describe the game at all -- it only applies to the background story. Was it conceived as something completely different? Champion of Jorvik or something like that would have been much more appropriate.

Shadow
03-25-2011, 10:53 AM
Can you brighten the font a bit? The grey on black is a little hard to read.

I find this link (http://hans.fugal.net/vim/rgbtxt.html) useful when working on webpages.

That is a helpful site for colors. I'm trying to find a good balance with the main font color. Too bright and it strains the eyes. Too dark and it's hard to read.

Shadow
03-25-2011, 11:45 AM
Most of the major plans for the site have been implemented, so what do you guys think?

New Look (http://www.soldak.com/)
Old Look (http://www.soldak.com/images/screenshots/website_2011_3_18.jpg)

Bluddy
03-25-2011, 11:50 AM
It's a complete makeover. Great job.

The only other thing I can nitpick (other than what I said in the post above) is the background image for DC. Seems like it was made a little darker (which is good), but it's nowhere near as good as the images for DoP and Kivi. I think a more zoomed out image, that looks more similar in scale to the other background images (obviously not exactly similar because of perspective), would be better.

It's possible the isometric view makes for better background images -- it looks more like wallpaper.

forevernomad
03-25-2011, 12:00 PM
Huge difference, looks amazing, kind of agree with my buddy Bluddy that the perspective view makes the DC image look different to the others.

Nice to see your awards right there on the page as well, congrats on those btw.

Shadow
03-25-2011, 01:22 PM
A new DC background image is now up there.

forevernomad
03-25-2011, 01:24 PM
That's the one :)

Amberjoy
03-25-2011, 03:55 PM
I find the greyish lettering a little hard to read. If it was a hair brighter..closer to white, it would help me avoid squinting. Other than that, it looks great.

Shadow
03-25-2011, 04:07 PM
I find the greyish lettering a little hard to read. If it was a hair brighter..closer to white, it would help me avoid squinting. Other than that, it looks great.

I did make it a little brighter today. If you reload one of the pages do you still feel that the font is a bit too dark?

Shadow
03-25-2011, 05:31 PM
We just made a couple more changes. There is a new background on the non-game specific pages that should match the other pages a little better.

We also just added an animating banner on the front page. What do you guys think? I am a little worried that it might be too distracting.

Castruccio
03-25-2011, 06:22 PM
From the perspective of a guy who isn't a web designer but who visits the page often, it looks great. I don't think the images on the front banner are too distracting, although some others may feel that it makes things look less streamlined. I guess you could make it the kind of banner that scrolls the new frame instead of the kind that flashes the new frame. (see this banner for an example of the scroll effect: http://arcengames.com/w/). This is also what Valve does with the banners on Steam.

torikamal
03-25-2011, 07:56 PM
Every day I tune in and the website keeps looking better and better. I actually like the scrolling idea a lot--I think you are right, though, a smoother scroll instead of a flash would do it more justice. However, kudos to all the work you've done and are doing!

Bluddy
03-26-2011, 02:47 PM
We just made a couple more changes. There is a new background on the non-game specific pages that should match the other pages a little better.

We also just added an animating banner on the front page. What do you guys think? I am a little worried that it might be too distracting.

I like the animating banner. I'm going to nitpick that non-specific background image though.

It consists of 2 images side by side. However, unlike the DC images, the perspective of both images is different, making it such that my brain gets distracted by them as the camera seems to come to a 'point' somewhere in the middle of the page. It should be like the DC images, which almost replicate the same viewpoint, making it seem like they could almost be one continuous image.

Amberjoy
03-26-2011, 05:05 PM
I did make it a little brighter today. If you reload one of the pages do you still feel that the font is a bit too dark?

Tiny bit better. It's readable. Thanks.

torikamal
03-26-2011, 06:54 PM
I think it would make sense for the game slider on the front page to also link to the game if you click on it--for example, if it was on the Depths of Peril image and you clicked on it, it would take you to the DoP page.

fab
03-27-2011, 10:14 AM
Ok, so I'm planning on reworking the website (http://www.soldak.com/) a little bit. For the most part I like how it works from a functional standpoint, so I'm not likely to change much in that regard. What I want to focus on is making it look nicer and more professional. Since you guys are my audience, I would like you input. What do you think would make it look better?

Here's a screenshot (http://www.soldak.com/images/screenshots/website_2011_3_18.jpg) of what it looked like when I wrote this just in case I have changed anything already.

Hi Steven,

One thing that comes to mind is you have a basic type contrast of bold vs normal weight fonts, but otherwise the type is "monochromatic" throughout the pages.

You might get a nice refinement by contrasting serif and sans-serif fonts, for example titles vs main content.

http://webdesignerwall.com/tutorials/typographic-contrast-flow

Serif is fitting on RPGs of course it gives that homey RPG feel, but it is not very readable at small sizes.

You could also line up the left and right edges of the top tabs to the left and right columns, for consistency and a nice vertical feel (ie "grid based design").

Are you designing the site yourself? I am a developer as well and I want to get better at web design. Unfortunately it's very hard to find good introductory design books.

This one was recommended to me. It introduces CRAP : Contract Repetition Alignment and Proximity :) It doesn't get into color, which is a good thing, because color could be a whole book in itself, but it has lots of simple exercises and a decent section on typography and all types of type contrasts. It's really helped me "see" the differences in fonts I never paid attention before.

http://www.amazon.com/Non-Designers-Design-Book-Typographic-Principles/dp/1566091594

if you know of a better book please let me know!

Font selection is made a little harder when you have a dark background, because the alaising tends the makes the text fatter or thinner depending on the font size and font weight.

Last but not least, why not design a completely different layout for the landing page? Where you can show all your games at once without a carousel and link to the inside pages? On that landing page you can put all the secondary stuff like RSS, blog etc at the bottom in a large footer.

Bluddy
03-27-2011, 10:30 AM
I agree that the fonts seem like they could be changed to something a little more appealing, especially since there's quite a bit of text.

Roswitha
03-28-2011, 10:36 AM
Are you designing the site yourself? I am a developer as well and I want to get better at web design. Unfortunately it's very hard to find good introductory design books.

This one was recommended to me. It introduces CRAP : Contract Repetition Alignment and Proximity :) It doesn't get into color, which is a good thing, because color could be a whole book in itself, but it has lots of simple exercises and a decent section on typography and all types of type contrasts. It's really helped me "see" the differences in fonts I never paid attention before.

http://www.amazon.com/Non-Designers-Design-Book-Typographic-Principles/dp/1566091594

if you know of a better book please let me know!


This book is part of a series by Robin Williams. There's also the Non-Designer's Web book and Type book. The Web book would probably be really helpful here. I would recommend reading the Design book first, just to get the basics (for anybody else who's reading this).

Shadow
03-28-2011, 11:17 AM
BTW Depths of Peril is the only game whose name and logo really doesn't describe the game at all -- it only applies to the background story. Was it conceived as something completely different? Champion of Jorvik or something like that would have been much more appropriate.

DoP was named after the event that started everything. Kivi and DC are named after actual people related to the story, so they are named differently.

Are you designing the site yourself? I am a developer as well and I want to get better at web design. Unfortunately it's very hard to find good introductory design books.

Yes, I design the site also. The art itself sure isn't mine though (as in mine would look like crap).

DarkShrike
03-28-2011, 11:36 AM
I am loving the new look of the Din's Curse page. I think it does a great job of catching your eye and making Din's Curse look appealing if you have never heard of the game (or even if you have - though at that point you don't need the web page to make it look appealing ;) )

ebarstad
03-28-2011, 12:31 PM
For the game screen shots, it might be good to use a "light box" instead of having them just open in a new window/tab as they do now when you click on them.

fab
03-30-2011, 06:55 AM
This book is part of a series by Robin Williams. There's also the Non-Designer's Web book and Type book. The Web book would probably be really helpful here. I would recommend reading the Design book first, just to get the basics (for anybody else who's reading this).

Oh this is awesome!!

To be honest her designs look old and her web design book seems pretty outdated, but what she excels at is the examples. They are really simple and make it much easier to grasp one thing at a time. THey're easy to reproduce in Photoshop, just trying out the fonts and the contrasts and so on is a great learning experience. "DONT BE A WIMP" is forever fried in my brain :)

I didn't know she made a type book. Thank you!