• New Horizons on Maelstrom
    Maelstrom New Horizons


    Visit our website www.piratehorizons.com to quickly find download links for the newest versions of our New Horizons mods Beyond New Horizons and Maelstrom New Horizons!

Hearts of Oak Promotional Website

Armada

Armada

Sea Dog
Staff member
Administrator
Project Manager
3D Artist
Storm Modder
For those that are not yet aware, Captain Murphy has set up a separate website for Hearts of Oak, which is intended to gather all the latest news, screenshots, concept art and videos into one place.
You can view it via this link: http://www.heartsofoakgame.com/

It is a largely automated site, taking news articles from our IndieDB page and developer videos from Captain Murphy's YouTube channel, for example. Only some media, such as images, need to be uploaded manually at the moment.

In also includes details about the game, along with the FAQ we first published on the Wiki, and a link to the PiratesAhoy! forums.

To be clear, it is not a replacement for PiratesAhoy! (i.e. it isn't another forum), but merely a more accessible place for people to find all the latest content, rather than hunting it down across all our various promotional pages.


Now, at this time the site is very much a work in progress. The design and layout are just placeholders, and what we really need is to come up with a more refined, user-friendly design for it. So, if any of you have some ideas, please share your thoughts below. The site is very flexible, so keep an open mind when proposing new concepts.

To edit the site yourself, you will need to make an account there and inform Captain Murphy of your username (via PM, preferably). He can then give you the rights to change the design and layout.
 
The zBrush sculpt in the Santísima Trinidad album isn't made by anyone of us, could someone please remove this image?
 
Ok, so today I sat for a while to the PS, and here's first pics on my ideas about improving the site. Bear in mind this is WIP and will be improved and altered shortly. I disregarded UI requirements also (as I don't know them) and just tried to put Garamond and Bodoni on the same page and went for 1700's newspaper feel. I'll work on readability too in next few days, as I still have no web fonts and my working environment needs to be set up for browser size-conciousness.
Website test1_p1.png Website test1_p2.png
 
That's a very striking design! I like the look of it so far. :thumbs1
 
It does look very lovely, I am very thrilled from the Fell's arabesque ornaments! Good work truly, I admire such original use.

If may I propose some details (nitpicking most likely anyway), but please do not take it as anything more than at least somewhat constructive criticism.
-What font is "FEATURED MEDIA" in? Would not de Walpergen's Three lines Pica fit there better with the style?
-Similiarly "News" does seem bit different from the other fonts, perhaps Double Pica (21 points)?
-What is the team's opinion of writing while keeping periodic ortographic rules, well, most notably long s anyway? As I have written already in my team application, I would more than gladly manually add the ligatures &c., if there would be interest.
-Perhaps instead of the simple white line something more intricate, like this Fell's pattern I attached? Perhaps even those thick patterns could be usable in between articles.
Website test1_p1.png
 
I like the Fell pattern there.

Instead of "crew wanted", I would go with "help wanted". "Crew wanted" just sounds a little corny to me, although I'd like more opinions on that. (Hint)

Even though this is just a concept, I wanted to make it clear that we'll need to get rid of all references to PC DVD's. This game won't be distributed through physical mediums for obvious (requires lots of $) reasons.

I think the HoO logo would look better with colors.

Other than that, I like it and I think you did a good job on the design.
 
I used in total 3 typefaces: Garamond for body text and sub-headlines, Bodoni for all headlines, varying spacing but, same weight so far as it's the only weight I have, and IM Fell is retained only for logo and "Crew Wanted".
-I'll try anything you guys suggest, this is WIP. I'd like to explain my logic for work so far though. For one, IM Fell sucks for small sizes. It's universally known that GRUNGY FONTS DON'T WORK FOR WEB. Unless it's truly huge. Thus kept it for "Crew wanted", and think difference would bring the message out from headlines all around it.
-Garamond is almost identical to Fell, only clean-cut, so wouldn't bring in the feeling of the third typeface to the overall. I will try to limit font usage to 2 (well, 3 here), so the style could be used for other promo material, and still retain it's uniqueness.
-Multiple weights however is free-for-all and can bring much needed playfulness between body and headlines. I'll go for it tomorrow with better font sets downloaded. I'm aiming for the style by Haereticus and one you can find in period map annotations or newspapers.
-I also think that modern style and typography would be better, because literal historical replication is just bad design. That is my stance on long S too, in the text that first and foremost has to be readable. But as there is strong affection for the logo and UI design by Haereticus, I tried balanced approach. That is, clean-cut but period-evoking typefaces, depth perception with background, clean forms (no parchment imitations, please). And yes, I used Fell Flowers for ornaments, and used sparingly they can only help.
***
I'll try with colors, but dark brown haven't worked for me anywhere so far except white background, so I'd go part- color. Partial logos or different colourings is not feared in contemporary branding, it's actually useful technique. Also, is 3D logo is out of question? A you see here, the problem is that logo is bloody complicated and needs to be separated from backgrounds.
 
Last edited:
Ashinokami said:
-I also think that modern style and typography would be better, because literal historical replication is just bad design. That is my stance on long S too, in the text that first and foremost has to be readable.
Click to expand...
Agreed. It has to be easy for people to work with, even the less historically inclined. :yes
 
@Ashinokami
Looks very nice! I really like the style.

Again, can someone please remove this image:

- Image removed-

This is made by someone else for 3d printung for his Santísima Trinidad model.

Edit:
Image removed, thanks Captain Murphy
 
Last edited:
Each item is a dynamic object that that consumes some data source for its information. The titles and the areas for them have to be able to handle different lengths of text without overrunning or getting cut off. The news and videos are pulled from different RSS feeds and use an XSLT to show them as they are now. Also, sections (divs) will re-stack as the site is changed in width from a full site (max of 1000px wide for best formatting) down to around 300px. Typography will have a big effect as you change in widths as well. What may look good at 1000px won't look good at 300px. If you want, you can build the site using a program called Artisteer as a full template in their demo version then send me the artx file and assets. I can then export it for the site in the correct format and tweak it from there. It is a very quick look at how the site will look in a WYSIWYG format.
 
Thanks, exactly what I would have asked, Murphy. I was thinking to start learning Fireworks, as it's used more around here, but that or aristeer will be way later, I'm way behind on my modeling, so now just quick concepts in PS. Also, can the site support animated flyouts for articles, so no new page be loaded? I kinda hate clicking Read more..'s :D Thought site could appear more bustling if more info is on the same page as well..
 
Flyouts are fine right up until the 30% of users on mobile get on it and the Javascript renders funny on them and never loads the article. :nogood Been there, done that! I ran into that issue on an article system a few months back and we never anticipated the range of random browsers people used. Another issue is that the articles and vids are linking to the source site through the RSS and it doesn't actually send the full content, instead it gives a link back to the source page. We would have to post the content on an article system on the site to have all of the content there, defeating the purpose of making the site automated so that it consumes different feeds for the content.

When loading custom fonts, realize that each font has to be downloaded by the client in order to render on the page, so pick ones that are SUPER small font packs.
 
Nice concept, Ashinokami!

Captain Murphy already pointed out the technicalities I was getting ready to feed back to you, so my only constructive criticism is... holy giant headers, Batman! You'll probably want to shrink (slightly) the HoO/PA! logos and bring it and the "by" line up and to the same baseline as the game subtitle. Basically, make it read more as one unified line of text rather than [graphic] [graphic]. That will give the body a bit more room.
 
Marion van Ghent said:
You'll probably want to shrink (slightly) the HoO/PA! logos and bring it and the "by" line up and to the same baseline as the game subtitle.
Click to expand...
Only a small point, but personally I'd remove the "by" altogether. Just having the HoO logo and PA! logo somewhere else would be fine. ;)
 
Wasn't sure if the "by" part was part of the HoO brand, as it were. If the PA! can be moved to a secondary location, that would work much better :)
 
Wasn't very creative today, so just small alterations:
Website test2_p1white.pngWebsite_test2_full.jpg
I scaled down everything to more real life sizes (screen is 1440x900), full page is 1000pix wide.
@Marion van Ghent, I chose a central logo in order to have a big poster-like area for half of primary screen, because current site has little filler information, so thought that going almost bare poster can be good idea. Mission statement can go into area below or besides logo (now it's under "Features"). I'm working on separate bare bones version, will show it tomorrow.
Also something with full-wheel logo embedded in white boxes is also in works.
Website test2_p1_colour.png @Post Captain, This is full color, with lighter background to better pop out, but I still prefer white one , just because it goes better with current austere aestehtics.
And noticed now that I forgot ornaments, but I'll ad those in next version, big dark boxes , like "Features" can certainly use some, even more than just from Fell set.
 
I actually quite like that version with the coloured logo, at least because it's more recognisable than the white logo and doesn't seem too out-of-place, in my view.
One thing that stands out in both examples is that "Help Wanted" doesn't contrast well with the background, but maybe a different background would fix that.

Also, while I like the idea of the background transitioning to an underwater scene as you scroll down, I'm wondering how it would look if just the top half of the image remained static when scrolling.
That would depend on what options the site itself has, though.
 
You must log in or register to reply here.
Back
Top