Archive for the ‘labs’ Category

Vikings of Thule receives an Update tomorrow!

February 16, 2010

Vikings of Thule will be offline for a few hours early tomorrow while we are updating! As we move closer to the end of the beta era, Vikings of Thule is receiving many exciting new updates to make the playing experience a memorable one for new players and our veteran players, as well.

In this update, you can expect to see a better registration process, a brand new tutorial with gives rewards during and after completion, an improved marketplace with better sorting options, post to profile options to boast about your achievements on Facebook, many profile changes and a new game header with easier options to become a fan or leave feedback.

A major change we have made concerns an issue many players share regarding forfeiting during duels. Those who forfeit will now incur penalties and the player remaining will receive rewards for their valiance. If a player decides to forfeit a battle, a confirmation window will pop up and alert them that they will lose the cost of the battle, their runes, and 50% of the respect points they would have lost during the battle. The player remaining will be refunded their duel costs, have their used runes returned and other small rewards which may not all be in place yet. We hope this helps in keeping fair game play and adds to the enjoyment and challenge in playing.

We plan on releasing another update in the near future where we will have fixed any bugs that we may spot after this update and will include even more features, including the introduction of using your Wights during duels! We are also in the process of creating the official Gogogic forums, which will be linked from the game’s header bar. The forums will be a bit plain at first, but we can make it an exciting location to hold discussions with your help and feedback. Vikings of Thule will have its own forum, as will each of Gogogic’s other titles. In the coming months, we also plan on including messages, an in-game chat system, more assets, new battle cards, mini-games, town management options, quests, missions and the option to form alliances.

Exciting times are happening and we look forward to seeing you all in Thule!

Labs: Flash based Coverflow Revisited

December 15, 2007

Siminn Coverflow Small

The initial post that featured our very own Flash based Coverflow has gotten a huge response. We have been bombarded with email since we posted it and we’ve come to realize that we will probably have to write, at least, a couple of follow-up articles to answer some of the questions we’ve received. Here is one such article.

The Question:

Josh asks: “I saw your Coverflow thing. Nice. I”m looking and wondering how you got it to loop. I know you guys are working on a post about it and can’t release all the info but I’d love to pick your brains about it. At least could you point me in a direction.”

Ari Answers:

Hi there Josh.

Interested in the loop you say. Let’s dig into our code, shall we?

To keep every slide’s position, I don’t store its x pos, I actually store its relevant position from the middle. From that index I calculate the x pos every frame the coverflow is moving.

By that I mean that the front slide in the center has the index 0, the slide to the right has the index 1, and the slide to the left has the index -1. As the slides go farther right or left, the index increases/decreases.

The rightmost slide then has the index Floor(slidecount/2) (Floor() cuts away any remainder of a number, 5.9 = 5), and the leftmost -Floor(slidecount/2), assuming we have an odd number of slides. If you want to support even numbers (which our solution does) you are going to have to make a few “if”‘s here and there.

To demonstrate:

Three slides and their indexes:

[-1 ] [ 0 ] [ 1 ]

Five slides and their indexes:

[-2 ] [-1 ] [ 0 ] [ 1 ] [ 2 ]

and so forth.

The reason for why I do it like that is because it is easier to find the relative scale position, meaning it is easier to find where one slide is supposed to go between the value 0 – 1 rather than 275px – 550px, and it is also much easier to tween.

So when a slide is at its center, its index is 0, and scale position is also 0, (0 / Floor(slideCound / 2) = 0) when it is at its rightmost position, its index is Floor(slideCound / 2), and scale position is Floor(slideCount / 2) divided by Floor(slideCound / 2), which is 1. Then, we can figure out exactly where the slide’s x position is supposed to be by multiplying (slide.index / Floor(slideCount / 2) ) with (paneWidth / 2). This makes the coverflow really dynamic and you can, in theory, have as many slides as you want.

We can even put that scale index in power of some number to push the slides away from the center. (Since putting a scale value (a value between 0 – 1) in the power of some number still outputs a number between 0 -1, only eased.)

I already know how much space each slide is allocated for its x value, it’s stored in a variable I call paneWidth (that you can adjust in the example on our site), therefore I can calculate exactly where each slide is supposed to be according to its index. When I want to make the slides loop I simply check if its index is more than Floor(slidecount/2) or less than -Floor(slidecount/2) when I’m moving them.

I move the slides simply by increasing every slide’s index by one, using the easeInOut easing function.

When one slide’s index has passed the edge index (Floor(slidecount/2) + .5) its index is decreased by slidecount. The +.5 is so it loops in the middle of the flip, but not the beginning or at the end.

So that is how we make it loop. I can make it fade out by simply checking if its index is between Floor(slidecount/2) and Floor(slidecount/2) + .5(Floor(slidecount/2) is full alpha, Floor(slidecount/2) + .5 is no alpha) and for the minus values too.

If you have any more questions feel free to ask.

Conclusion

This answer requires some in-depth knowledge of programming in Flash and is not intended to be a “beginner-friendly” walk-through. Additional posts will be at the same level as this one, since we are more interested in addressing complex issues and solutions.

Please take a look at our initial Coverflow demo and how it is currently being used at a client site

J#

Labs: Flash based Coverflow

December 6, 2007

CONTACT INFO: If you want to get price quotes for this control send an email to [info at gogogic dot com]

Coverflow

(Picture is a link to an online app that you can mess with)

Gogogic was recently asked to implement a coverflow like micro site (head banner) for a client. The implementation needed to be very smooth, very light weight and highly customizable, because the client wants to be able to change images easily.

We took a good look at what was already out there but basically we didn’t find anything adequate in terms of quality and customization. We finally decided to build our very own coverflow application from scratch because – in the end – it would be more cost efficient than to find a 3rd party control and customize it.

A lot of Flash cover flow implementations are based on Papervision, which is an excellent product, but is sometimes misused a little. We felt that creating cover flow functionality with Papervision would be like shooting a mouse with a cannon – a little misguided. The result is also usually a loss in smooth motions and some tortured scaling.

Anyway. We just finished with our version of Flash based dynamic coverflow, all based on pure AS3 goodness. You can mess with it here, and over here you can see it in action.

UPDATE: Check out this coverflow implementation as well!