Search the Community

Showing results for tags 'point and click'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 14 results

  1. Hey! 👨‍🚀 I have been experimenting with Phaser for a while now and started a project like a year ago. It was a real time top-down rpg game where I ended up spending a lot of time trying to put together some fun combat mechanics. My visions for that project grew pretty big and I wanted to do something more short-term and I had been thinking much about creating some point and click adventure based on real photographs because I knew so many fine and inspiring places nearby that I could use as environment instead of having to bother spending a lot of time in creating graphics that I never get satisfied with anyway. So I started coming up with a story and went out some weekends this autumn with my Honor 8 mobile camera — yes, this is going to get real low budget 😏 — and collected some image material in locations that I found suitable. There is everything from dark pine forest to more open rocky areas, mountains and beech woods. There is even some material captured from the ruins of an old abbey! These images would then be sorted out to form the kind of game world I wanted. This is a process which I'm still engaging in, but I've started to make out how the first part of the game are going to be. Introduction The forest is spoken of as a place of magic and strange experiences. Still, there are no roads disturbing its ancient splendor. Although traces of some human inhabitants do exist, their wisdom and practices have since long been laid to rest by the passing of time and the power of nature. Some say their spirits still reside there and attempts have been made to unravel the mystic forces witnessed by people of recent times. After losing your friend during a camping adventure in the remote forest — you are contacted by the spirits of the land. You gain knowledge about a conflict between the supernatural powers that resides in the area. Dark forces have risen against the forces of light since a sorcerer came to dwell within the deep of the woodland. He has taken your friend as a human sacrifice. Will you find him before the night of ritual and restore peace to the forest? 💁‍♀️ Gameplay As can be read in the little introduction; the game is going to be about encountering dark powers. 🧛‍♂️ So there are areas in the game which you will have to clear of the darkness before working there or continuing to the next area — otherwise you'll go dead/mad/asleep-to-wake-up-later-having-wasted-a-lot-of-time or something. So in relation to this; an early idea for the game was to have some kind of mechanic where players have to draw magical incantations from a spell book. 🧙‍♂️ This is achieved by using a JS lib that makes it possible to draw vectors and compare vectors. The result is the matching percentage of the vectors — so in that way I can adjust difficulty and maybe also set different requirements for matching by shape. To make this drawing stuff more challenging; when the player are drawing in these dark areas — the canvas will shake and randomly erase lines you just drew and stuff like that. The first spell will be a lesser banishing spell to clear out the early dark areas. Then other spells will be added to solve greater problems in the game. Another mechanic that I'm developing is actually an idea I came up with for the previous Phaser project which I wrote about in the beginning. This mechanic is based on dowsing. So the player will have a crystal pendulum as a tool when finding clues and information. The pendulum can be dragged around the area and will move in different ways depending on what secrets can be revealed in that certain place. The key to interpret the pendulum will also be in the spell book I guess. 💁‍♀️ So these are two mechanics that is under development along with the first part of the game. Some video teasers of how this will look can be found here: Project Page with Demo Videos Another thing is that the gameplay will have a time aspect. So you will always have to return to the camp when it's getting dark because at night; all the areas in the game will be dangerous to be in, just like the areas affected by dark magic during the day. Below you will see some images of the stuff I just covered. And here is a link to my website and twitter where further updates about the game and the development process which probably will be pretty slow: http://www.heavyrealm.se/ https://twitter.com/jonteferm I imagine I will work more on the game if I also sometimes tell other human beings what I am doing.
  2. Good afternoon, I was hoping that the community could look over my code and see if something needs to be adjusted. I recently started learning Javascript and I just started learning Phaser and easystar yesterday so this might all look ridiculous. At the moment all I am trying to accomplish is pathfinding the way it is done in a point and click adventure game such as Monkey Island or Day of the Tentacle from Lucasarts. I am trying to achieve it much how AGS(Adventure Game Studio) allows the user to set it up. Basically, you import a room image and then you draw over the room with a chosen color(Sort of like drawing a mask) all the area's that a character can walk and find a path to and from. What I am trying to achieve in my code is the same principle above and I am trying to use easystar and Phaser to accomplish this. Let me explain my code: I have three images: the 'background' image which will load up the image of the room the character will be in. 'walkablepath' will be the image that contains the image mask. Anything that is hot pink is where the character can walk. 'maincharacter' is the player character that will find the path when we click on a part of the screen we want the player to go to. At start we will create a 'bmd' object, create the walkable grid and then destroy the bmd object. The 'bmd' object is what will hold the walkable mask information. It will match the same size as the room image. It will have complete transparency and will be overlaid over the background image, but not visible to the user. 'walkableGrid' will be the grid data that easystar will use to calculate the walkable paths. 'walkableRGB' will contain the RGB value of Hot Pink so that we can find the hot pink pixels. 'gridCollection' will collect the X and Y pixel data in the 'bmd' object and push it to the 'walkableGrid' as it goes through each pixel line from top to bottom. The code will do this by iterating through each X and Y pixel in a loop. After that is completed, the mask will be destroyed, easystar will have a setup to determine the acceptable tiles in the grid. Function calculateWalkPath() will be called each time the user clicks on the screen and the game will try and calculate the path for the user to walk and move him to his destination. Please see the code below: //Set the initial game paramters - Will start with 800x600 resolution and will use WebGL as a renderer and default back to Canvas if WebGL is not present. var game = new Phaser.Game(800,600, Phaser.AUTO, '', { preload: preload, create: create, update: update}); var easystar = new EasyStar.js(); //Lets get easy star in here. var bmd; //This will be the object that will take the pixel data of the scene. //Assets that will be preloaded at start function preload(){ game.load.image('background', 'assets/room1.png'); //The game room background that will be loaded. game.load.image('walkablepath', 'assets/walkablepath.png'); //The room's walkable area. game.load.image('maincharacter', 'assets/character.png', 32, 48); //The main characters animated spritesheet who will be walking around the room. } //The first function called when we start our game function create(){ //We are going to obtain the width and height of the background room. var backWidth = game.cache.getImage("background").width;var backHeight = game.cache.getImage("background").height; bmd = game.make.bitmapData(backWidth, backHeight); //Getting ready to determine the room size and get the pixel data of the walkable path. game.add.sprite(0,0,'background'); // Will add the room background to the desktop. It will place the upper left part of the image to the upper left part of the screen. bmd.alpha = 0; //Let's make sure the image is completely invisible to the users eyes. bmd.draw('walkablepath', 0, 0); //Will overlay the transparent walkable path over the background image. var walkableGrid = new Array(); //Lets make the grid that easy star will define as the walkable points. var gridCollection; //This will collect the 2 dimensional array grids and push it to the walkableGrid. var walkableRGB = "255105180"; //This is the RGB value of the area's the user can walk on. - Hot Pink is the RGB Color //Following code will begin at the top left corner of the walkable area and check each pixel for the hot pink color. If it finds it, it will add a 0. If not, 1. for (i = 0; i < backWidth; i++) { gridCollection = "["; for (j = 0; j < backWidth; j++) { if (bmd.getPixelRGB(i, j) == "255105180"){ gridCollection = gridCollection + "0"; } else { gridCollection = gridCollection + "1"; } //If there is still more width in the image, it will add a comma. Otherwise it won't and the array can be closed off. if (j != backWidth) { gridCollection = gridCollection + ","; } } //Close up and then Push the Array to the walkable grid gridCollection = gridCollection + "]"; walkableGrid.push(gridCollection); } bmd.kill(); //let's destroy the walkable area path we created from view - we need to find a better way to do this process. easystar.setGrid(walkableGrid); //Let's add the 2 dimensional grid array we just created to Easy star's pathfinding grid. easystar.setAcceptableTiles([0]); //Let's also make sure that easy star is aware that the 0 tiles are the tiles that the player can walk on. } function update(){ } function calculateWalkPath() { //This function will be called every time the user clicks on a path to walk to. //Now let's calculate the path and presumably use tweening to move the character from it's current x and y position to it's next calculated position easystar.findPath(xClickDest, yClickDest, playerXpos, playerYpos, function( path ) { if (path === null) { //Do something like a shrug animation from the character for not being able to find a path. } else { game.add.tween(maincharacter).to( { x: path[0].x }, 2000, Phaser.Easing.Linear.None, true); game.add.tween(maincharacter).to( { y: path[0].y }, 2000, Phaser.Easing.Linear.None, true); } }); //Let's get this party started. easystar.setIterationsPerCalculation(1000); easystar.calculate(); } I have to admit, I did not test this code yet. I rather have a fresh pair of eyes on this as I spent a good half hour trying to figure this out today and feel rather brain dead. Now, my questions are these: Will this code operate correctly? Did I use Phaser and Easystar correctly? What about memory management and speed and what is a better way to manage this? How would you improve it? Also, can I set more than one acceptable tile for easystar and how? Thanks for looking and for your assistance.
  3. Hi My name is Robin Vencel, I am an independent games developer and the creator of the Monkey Go Happy series. www.monkeyhappy.com is completely free and has over 160 html5 stages right now. I add 2 new point and click stages per week. I personally create these with love and care for my fans. Right now I get about 10,000 visitors day. If you have any questions please let me know. Thank you for your time. Robin Vencel www.monkeyhappy.com
  4. Hello, I'm searching for pixel art artist who could help me with my new game. The game idea is a dark story setted simple adventure with RPG elements, which could be interesting. As I can't do any art at all, it would be hard for me to create the game, so that's why I would like to find an artist willing to help me. If you are interested, please PM me or send email to estkinn@gmail.com Thanks.
  5. Hello to everyone, I'm currently developing a fan-made, retro-style and non-profit game with Phaser based on the TV show Stranger Things. The main idea is to do a Point and Click game like old classics (Monkey Island saga, Indiana Jones and the fate of atlantis, etc...) with retro pixel-art graphics and chiptune music. I'm looking for GFX and Music artists If you are interested to collaborate with this project please contact with me and I'll send you a link to see the work in progress. (Sorry if there are some grammar errors, I'm Spanish).
  6. Hey yall, I just released a brief demo of Norco: Faraway Lights, a cyberpunk text adventure with a focus on the environmental and industrial histories of rural Louisiana. It features all original, lovingly rendered pixel art and an incredible soundtrack by New Orleans-based composer Gewgawly I. The demo is available for download or to play in your browser on itch.io. Thoughts and feedback are appreciated!
  7. Hi all, I have two sprites ( sprite A and sprite B ) that I want to select and move around the screen one at the time, like this: click on sprite A to select it, sprite B should be then deselcted click anywhere in the world to move sprite A to where the mouse clicked double click on a sprite A to cast spell 1 double click on sprite B to cast spell 2 Issues I have are: Issue: If sprite A is already selected, and I single click on sprite B to select it, then sprite A moves to location of sprite B. Intended: no sprite moves, sprite B is selected and sprite A is deselected Issue: If a sprite is already selected, and I single click on it, the sprite is deselected (and the other is selected). Intended: the sprite remains selected Issue: Double clicking on the world (outside any sprite) cause a selected sprite to move two steps towards where clicked. Intended: Double clicking on the world should be ignored Issue: Single clicking anywhere but the center of a selected sprite makes it move a bit towards where clicked. Intended: single clicking on a selected sprite should be ignored Issue: The two sprite overlap. Intended: collision and separation What I'm doing wrong Thanks! Code var playState = { create: function() { this.mouseClicks = 0; this.mouseClicksStarted = false; this.createPlayers(); this.myEvent = game.input.onDown.add(this.movePlayer, this); this.playerGroup.forEach(function(player) { player.events.onInputDown.add(this.countClicks,this); //param 1: sprite, param2: pointer }, this); }, update: function() { game.physics.arcade.collide(this.playerGroup); }, countClicks: function(player, pointer) { this.mouseClicks ++; this.player.canMove = false; if (this.mouseClicksStarted) { return; } this.mouseClicksStarted = true; //call function after x seconds setTimeout(function() { if(this.mouseClicks > 1) { if(player.role == "thrower") { console.log("double: casting thrower spell") } else { console.log("double: casting catcher spell") } //One click } else { this.selectPlayer(player); } this.mouseClicksStarted = false; this.mouseClicks = 0; }.bind(this), 250); }, selectPlayer: function(player) { this.playerGroup.forEach(function(player) { if(player.isSelected) { player.isSelected = false; player.tint = 0xffffff; } else { player.isSelected = true; player.tint = 0xff0000; } }, this); }, createPlayers: function() { this.playerGroup = game.add.group(); this.player = new Player(this.game, 'player', 'thrower', true); this.game.add.existing(this.player); this.playerGroup.add(this.player); this.player.reset(game.world.randomX, game.world.randomY); this.player2 = new Player(this.game, 'catcher', 'catcher', false); this.game.add.existing(this.player2); this.playerGroup.add(this.player2); this.player2.reset(game.world.randomX, game.world.randomY); }, movePlayer: function (pointer) { this.playerGroup.forEach(function(player) { if(player.isSelected) { if (this.tween && this.tween.isRunning) { this.tween.stop(); } var duration = (game.physics.arcade.distanceToPointer(player, pointer) / 400) * 1000; this.tween = game.add.tween(player).to({ x: pointer.x, y: pointer.y }, duration, "Sine.easeInOut", true); game.add.tween(player.scale).to({x: 1, y: .8}, duration).to({x: 1, y: 1}, 1000, Phaser.Easing.Elastic.Out).start(); player.rotation = game.physics.arcade.angleToPointer(player); } }, this); }, }; Player var Player = function (game, sprite, role, isSelected) { //save passed variables so they can be accessed later this.role = role; this.isSelected = isSelected; this.max_energy = 100; this.currentEnergyLevel = 0; Phaser.Sprite.call(this, game, game.width/2, game.height-150, sprite); this.anchor.setTo(0.5, 0.5); this.scale.setTo(1); game.physics.enable(this, Phaser.Physics.ARCADE); this.body.collideWorldBounds = true; this.body.bounce.setTo(0.9, 0.9); //this.body.immovable = true; this.playerKillParticles = game.add.emitter(0,0,15); this.playerKillParticles.makeParticles('playerParticle', 2); this.playerKillParticles.setYSpeed(-100,0); this.playerKillParticles.setXSpeed(-100,100); this.inputEnabled = true; this.input.useHandCursor = true; //this.input.priorityID = 1; }; Player.prototype = Object.create(Phaser.Sprite.prototype); Player.prototype.constructor = Player; Player.prototype.setRole = function(role) { this.role = role; }; Thanks!
  8. Hey Phaser people, I'm currently working on a 2d upperview point & click game, using Arcade physics. What I want to develop is a "smart movement" system, where if you click on a part of the map, your character shouldn't get stuck in obstacles, but pass around them. For now, I'm using tweens to move my character to the mouse position, which cancels the collision. Thus, it's a no go. this.game.input.onDown.add(this.movePlayer, this); movePlayer: function (pointer) { var time = 9.5; var duration = (this.distance(this.player.x, this.player.y, pointer.x, pointer.y) * time); this.tween = this.game.add.tween(this.player).to({ x: pointer.x, y: pointer.y }, duration, Phaser.Easing.Linear.None, true); } Any suggestions ? Thanks ! I've also attached a small screenshot/ drawing of what I strive to achieve.
  9. I am making a little game that is similar in style to the Covert Front point and click adventure games (http://www.mateuszskutnik.com/covert_front/index.php?id=cf_1). Navigation is pretty easy, you click on doors, and sometimes parts of the bottom of the screen to move between them. Here are some screenshots from the Covert Front game to illustrate the type of thing I want to do: In the first one you can click to go back when the cursor is near the bottom of the screen, and in the second one, you can change rooms by clicking near the bottom, or either door. I made a simple prototype where I navigated using arrow sprites, as seen below, which worked well and were easy to use. However, I would prefer not to have buttons like this. I was wondering what the best option would be to define clickable areas for movement. Should I create transparent sprites to define the doors and use the OnInputDown event as I did in the prototype, or would it be better to use a Rectangle, and check each onDown event to see if it is contained in the rectangle? I am wondering if there is a preferred method for doing something like this, or whether there are methods I have not thought about.
  10. Anyone working on a point and click adventure game? I'd be keen to share thoughts code etc.. Here is my favorite developer in this genre http://www.psionic3d.co.uk/ As an artist the graphics are no problem for me. The code however is another story. I'm starting out without a library in order to more thoroughly learn the code function behind it all. Currently looking at mouse event handlers on the canvas element. I can get canvas coordinates and get a hit test on an element but I don't have the experience yet to animate an object to a specific location on click - namely an inventory. The first code I wrote myself is a scene changer. It might help another newbie out there. http://harrywatson.altervista.org/momo/index.html Any insights, comments, would be appreciated
  11. Experience a dream-like atmosphere in this web-based point & click adventure.Solve music- and time-based puzzles to reveal the true nature of oOku.You can play the alpha demo herehttp://ooku.itch.io/ookuif you are interested in testing more levels you can send me a PM or join the facebook grouphttps://www.facebook.com/groups/1678578385758314Thanks a lot for your feedback and bug reports.Known Issues: seek buttons do not work in Firefox Links homepage: http://ooku.org twitter: https://twitter.com/ookuorg
  12. Hello all, I'm pretty new on game development and I've chosen Phaser as the framework for our project. We are a Brazilian dev team (to be honest we're just two atm lol). The project home: http://www.in8game.com Blog (Portuguese): http://www.in8game.com/blog/ And tests I'm doing with Phaser: http://www.in8game.com/prototipo/ Well, I've made some tests using the pathfinder plugin and it's cool. I'd like to ask you what do you think would be the better approach to a point and click player movement using the pathfinder. The player will have a "velocity" defined by the "vehicle" he is using atm. Idk if maybe I can add a tween tile by tile using the plugin or if it's better to use some physics here. Hope I made myself understandable. Sorry about my poor English. I'm willing to make something new and cool using Phaser to share with you guys. Thanks in advance. Rainer Lopez
  13. Finally after a few days I managed to create a combination lock using images. It uses createjs but should be really simple to use with any framework. No preloading so you might have to refresh the page - only tried in firefox http://harrywatson.altervista.org/combination.html
  14. Hi all, here is my first ever game. I've modified this post so my apologies if you've seen it already. Works on Firefox, Safari and Chrome (all Mac) and IE (Windows). Haven't given any thought to devices as yet but interested to try. Any feedback at all would be most appreciated. http://harrywatson.altervista.org/momo/index2.html .