Claiming of resources and update to a more professional look - Archipelago

in #utopian-io6 years ago (edited)

The last contribution focused on the "resource discovery" functionality; the ability for players to visit new islands and discover resources hidden on those islands.

Having uncovered the resources, this contribution adds the functionality for players to stake their claim on those resources, changing the board piece for one of their own colour and adding those resources to their total. This is a key step to opening the game to the goods production, building and the trade contracts that underlie the game.

In addition the contribution covers:

  • Updating the style of the surround for a more professional look.
  • A revision to the commentary system.



Screen Shot 2018-04-18 at 09.10.44.png

For a full view of the current state of the game see my github-hosted page:
https://miniature-tiger.github.io/archipelago/

Background details of the project and a list of previous updates can be found at the end of this contribution post.


New Features covered by this Contribution


Claiming of resources on islands

The "resource discovery" functionality allows ships to visit unknown islands in the archipelago and uncover new resources. When ships anchor next to unclaimed open islands, the resources present on the island are revealed.

The changes in this contribution add the functionality for players to stake their claim on those resources. When a ship is anchored next to the resources any unclaimed resources can be claimed by landing crew of the ship in proximity.

The unclaimed resource tile is activated by clicking on it and with a second click the resources piece is allocated to team making the claim. The game play can be seen below:



Screen Shot 2018-04-18 at 09.13.08.png

Ship approaching islands


Screen Shot 2018-04-18 at 09.13.52.png

An ironworks resource is revealed


Screen Shot 2018-04-18 at 09.14.06.png

The ironworks resource is claimed for Green Team

A future update will calculate the cost of setting up the resource production, requiring strategic decisions as to where goods are spent.

The change required a new javascript method to check whether a ship is anchored in proximity as well as changes to allow existing SVG pieces and the boardArray to be updated to the new ownership assuming certain conditions are met and integration of these changes into the game flow.

The code changes for this section can be found here:
https://github.com/miniature-tiger/archipelago/pull/35/files


Updating the style of the surround for a more professional look

The aim of this change is to make the board area as large as possible and to improve the overall look of the game.

  • All unnecessary items were moved off the surround, for example the Archipelago title, allowing the surround to be made transparent.
  • The Archipelago title was replaced with a logo added to base layer of board.
  • The surround, board size and tile size are now set dynamically based on screen size.

Looking good!



Screen Shot 2018-04-18 at 09.23.24.png

New cleaner layout in full screen mode


Screen Shot 2018-04-18 at 09.42.58.png

SVG logo added to the base layer of the board

The code for the design changes is covered here:
https://github.com/miniature-tiger/archipelago/pull/36/files


A revision to the commentary system

The final change in this contribution is an update to the commentary system.

  • A commentary bar has been added that slides in when tiles are clicked for a more professional look
  • Icons are added to commentary bar for the tile being investigated
  • The commentary wording has been updated including some cosmetic changes to team names


Screen Shot 2018-04-18 at 09.33.01.png

New commentary bar with icon and help text

The file changes can be seen here:
https://github.com/miniature-tiger/archipelago/pull/37/files

That is all for this update. If you have any queries please drop them in the comments or contact me on discord.


Details of the Archipelago Project

What is the Project About?

Archipelago is a new project that I have been working on. The aim is to develop a seafaring and trading turn-based strategy game. Players will guide their ships around the islands, searching for goods to aid construction of ships and their bases, trading with the central market and each other, and avoiding hazards like pirates and whirlpools.

Technology Stack

The project is a browser based game:

  • Mechanics: Javascript
  • Visuals: HTML and CSS initially but now moved across to Canvas and SVG.

Roadmap

For the short term roadmap the first main goal of getting ships on the board and moving at different speeds under the influence of the compass is complete.

The graphics overhaul is also now complete.

Work is now ongoing on the second stage which is resource discover, goods production, building and the trade contracts that underlie the game.

Work has also begun on adding pirates and conflicts.

Phase 1 - Board and ship movement: COMPLETE!!!
  • Board set up - COMPLETE
  • Basic ship creation: functionality and graphics - COMPLETE
  • Manual ship movement and board updating - COMPLETE
  • Basic compass creation: functionality and graphics - COMPLETE
  • Turn based activity of ship movement - COMPLETE
  • Logic of length of longer moves around obstacles - COMPLETE
  • Chaining together transitions to allow graphics of longer moves - COMPLETE
Phase 2
Land Squares and Resources:
  • Dashboard of player pieces and resources - COMPLETE (to be reintegrated)
  • Resource discovery - COMPLETE
  • Resource tiles (forest, iron, flax, gold etc) - in progress: forest and ironworks added
  • Goods production
  • Building: (recipes, times etc)
Contracts for delivery:
  • Semi-random (equitable) generation of trade delivery contracts
  • Creation of trade settlements
  • Dashboard for contracts
  • Mechanics for contract sign-up
  • Mechanics for contract delivery
The long term roadmap is still to be fully fleshed out but includes:
  • Islands (naming: for describing location ot pieces, trading settlements)
  • Central trading centre:
  • Conflicts:
  • Pirates:
  • Scoring:

Contact / Contribute

You can get in touch with me on discord if you would like to contribute.

You can find the current state of the game here:
https://miniature-tiger.github.io/archipelago/

The repository for the project is here:
https://github.com/miniature-tiger/archipelago

Have fun!



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Hi @miniature-tiger, your contribution has been approved.

Absolutely crazy how much the graphics have improved! Keep it up!


Need help? Write a ticket on https://support.utopian.io.
Chat with us on Discord.

[utopian-moderator]

Thanks Amos! I'm really happy with how it's turning out. I'm also finding SVG a really flexible solution and it does scale down to small icons really well. More to come!

Looks great! I'm familiar with code, but haven't played for a while, so I might not be the target user group. I tried it out for the first time now, I can move ships and claim resources, but I'm a bit lost. Is there also a "how to play" somewhere? :D


Need help? Write a ticket on https://support.utopian.io.
Chat with us on Discord.

[utopian-moderator]

It's a good idea, a help guide. Something to add to my roadmap!

The game is a fair way from finished currently (although the end of the basic set-up is in sight!) so at the moment moving ships and claiming resources is what you can do. I'll have goods transport and trade contracts in within a week or so, at which point it should all start to become clearer!

wow , it looks so cool , just like the "AGE EMPIRES" game based on the web UI


Need help? Write a ticket on https://support.utopian.io.
Chat with us on Discord.

[utopian-moderator]

Thanks Chans! I've never played Age of Empires but I know it's a huge game. It's a nice comparison!

Would be great to see some gameplay on dTube or a tutorial how to play.

I wish I had such design skills - Great Job!

Thanks @adasq!

That's a great idea! I've still a fair amount of work to do in completing the game but once I get to an alpha version some dTube could be in order.

For the design I'm new to development work so I'm really still finding out what I can do. There's lots of great graphics stuff on Utopian so it's a great inspiration to see what's possible.

pretty wild man ... are you a re tabletop enthusiast by chance ??

steem staying on the rise ! (-:

I never have been although it's probably the kind of thing I would get into if it fell across my path. I always enjoyed designing games as a kid though and it seemed a good place to start for pushing my development skills to the level where I can contribute a bit more around the place!

Probably an interesting game! But it's not clear. Good luck in developing your game.

this looks interesting. it does get a little confusing tho. but i love how you have trading in the game. great work 👍

Thanks! It's going to hopefully be quite a complex and strategic game - once I get it finished!

yea it definitely looks complex already! involvement of ships and trading alone involves a lot of strategy!

Hey @miniature-tiger! Thank you for the great work you've done!

We're already looking forward to your next contribution!

Fully Decentralized Rewards

We hope you will take the time to share your expertise and knowledge by rating contributions made by others on Utopian.io to help us reward the best contributions together.

Utopian Witness!

Vote for Utopian Witness! We are made of developers, system administrators, entrepreneurs, artists, content creators, thinkers. We embrace every nationality, mindset and belief.

Want to chat? Join us on Discord https://discord.me/utopian-io

Coin Marketplace

STEEM 0.29
TRX 0.11
JST 0.034
BTC 66095.77
ETH 3184.92
USDT 1.00
SBD 4.12