Part 2: Build TicTacToe Game in Figma | Advanced Prototyping In-depth Tutorial

This is part of the building TicTacToe Game in Figma where I'll be demonstrating the fantastic possibilities of using the latest Figma variables and advanced prototyping features to create some truly amazing games. Now, it's important to note that this is simply a fun experiment, but the real power of variables lies in their ability to enhance user experiences and facilitate user testing with advanced prototypes that feel incredibly realistic.
#Figma #AdvancedPrototyping #figmatutorialseries
→ Practice File here: bit.ly/TicTacToePracticeFile
→ Link to Part 1: kzread.info/dash/bejne/f4CsqtNxosfPkbQ.html
⏱️Timestamps:
0:00 - Intro
0:48 - Set X & O from First Frame
2:04 - Drawing the Winning Line
8:30 - Reset or Replay Game
🔴 Don't forget to Subscribe. Trust me it's absolutely FREE - bit.ly/SubToDesignXstream 😅
You have got some ideas or topics in mind? Please do comment below we will make sure to check it out and do it if possible 🥳
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
🌍 Social Media:
↪︎ LinkedIn - www.linkedin.com/company/DesignXstream
↪︎ Instagram - DesignXstream
↪︎ Facebook - DesignXstream
↪︎ Twitter - DesignXstream
↪︎ Website - DesignXstream.com
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
🏷 Tags: build tictactoe game in figma, game development in figma, figma game prototyping, advanced game logic in figma, figma for game creators, creating games on figma, figma game making, creating a game in figma, building a game on figma, creating game logic in figma, easy game prototyping in figma, figma advanced prototyping games, figma gaming, games figma, figma game creation, easy figma game prototype, fully working game on figma.

Пікірлер: 14

  • @jebinraj1999
    @jebinraj199911 ай бұрын

    Brother i need a auto layout tutorial like responsive

  • @DesignXstream

    @DesignXstream

    11 ай бұрын

    Will make one on the new auto layout features!👍🏽

  • @maheshbiruduganti1718
    @maheshbiruduganti171811 ай бұрын

    Hi, need animation code to rotate an object in diagnol , in react

  • @DesignXstream

    @DesignXstream

    11 ай бұрын

    I'm not an expert in react. We only do videos on Design on tools like Figma 😉

  • @TheJaimexxd
    @TheJaimexxd5 ай бұрын

    Quick question, what happens when theresis a draw, u havent covered that scenario, and I cant tink of a way to solve this scenario, any help would be welcome

  • @DesignXstream

    @DesignXstream

    5 ай бұрын

    For the draw scenario you just have to check if c1 != "c1" and c2 != "c2" and so on... so what this does is it will check if all the cells are filled. If all cells get filled and there is no winner it means it is a draw. check this screenshot: ibb.co/2YXrv3g

  • @kritipaudel8454
    @kritipaudel84547 ай бұрын

    HI , DID YOU BY CHANCE MISS THE INTERACTION/ PROTOTYPE WITHIN THE VARIABLES C1-C9 WITH X AND O ? WHILE THEY WERE KEPT IN COMPONENT SET

  • @DesignXstream

    @DesignXstream

    7 ай бұрын

    Sorry, I did not get you! Are you referring to the community file? IS some interaction missing in it?

  • @kritipaudel8454

    @kritipaudel8454

    7 ай бұрын

    @@DesignXstream I am referring to the CELL we created for c1-c9 and x and o. Doesn't "the CELL component" have to have interaction with X and O? Because i am not getting X or O while clicking on the anything from C1-C9 PS, i did the part 2 thing u have done isn't it becz we have no interaction with X and O. i think u missed the component prototyping part. i am not sure though.

  • @DesignXstream

    @DesignXstream

    7 ай бұрын

    ​@@kritipaudel8454 I think I got your query, So if you check Part 1 of this video at around 6:40 I've assigned each cell a variable. Also showed an example there how the cell is filled with X or O based on the variable value changing. Hope this answers your query!

  • @taiwotalodabioluwa8270
    @taiwotalodabioluwa82706 ай бұрын

    Can you make a beginner aspect of this? It seems really complicated 😩😩😩 I have watched and watched and still didn't get it

  • @DesignXstream

    @DesignXstream

    6 ай бұрын

    Try going through previous videos it could help you catchup on some concepts. It is difficult to cover everything in one video!

  • @doddyrizkydarmawan9443
    @doddyrizkydarmawan944310 ай бұрын

    how to create draw in this prototype?

  • @DesignXstream

    @DesignXstream

    10 ай бұрын

    For the draw scenario you just have to check if c1 != "c1" and c2 != "c2" and so on... so what this does is it will check if all the cells are filled. If all cells get filled and there is no winner it means it is a draw. check this screenshot: ibb.co/2YXrv3g

Келесі