Aankondiging

Inklappen
Nog geen mededeling.

Tutorial: Isometric Pixelart Basis

Inklappen
Dit topic is gesloten.
X
X
Inklappen
Eerste Vorige Volgende Laatste
  • Filter
  • Tijd
  • Toon
Leeg alles
nieuwe posts

    Tutorial: Isometric Pixelart Basis

    [center:arnlmvis]Isometric Pixelart

    [/center:arnlmvis]

    Wat is "Isometric Pixelart"?
    Isometric, ofwel isometrisch in het nederlands, is een projectiemethode.
    Een projectiemethode om ruimtelijke figuren in een plat vlak weer te geven.
    Bij deze methode lijkt het of je schuin van boven 45° van de zijkant van het te projecteren object aankijkt.

    Hoe maak ik "Isometric Pixelart"?
    Eens je het systeem doorhebt, is het simpel.
    Je gebruikt blokjes van 1 pixel hoog en 2 pixels breed.
    Isometric pixelart wordt altijd in MS Paint gemaakt.


    Dit voorbeeld is uitvergroot.

    Wat gaan we hier maken?
    Een huisje is misschien de beste manier om het te laten zien.
    Een huis kan gaan van een kasteel tot een vervallen, oud krot.
    Hier houden we het simpel, dus maken we een standaard huis.

    Welke tools gebruik ik best?

    Het potloodje, voor het fijnere werk.


    De lijn, om mooie strakke lijnen te bekomen.


    Het vergrootglas, om een beter zicht op je pixelart te hebben.

    ----------
    De basisvorm
    Om te beginnen maak je eerst het grondoppervlak.
    Je kunt het best 6x of 8x inzoomen. Zo zul je ook een beter zicht krijgen op je werk.
    De eerste lijn maak je best zo. Dan volgen er nog twee lijnen die op deze komen, en een andere die paralel loopt met deze lijn.



    Zorg er wel voor, dat de lijnen die paralel met elkaar lopen, even lang zijn.
    Nu hebben we al een grondoppervlak.



    De hoogtelijnen zijn redelijk gemakkelijk.
    Dit zijn lijnen die recht omhoog gaan. Let wel op dat de hoogtelijnen even lang moeten zijn!



    Nu de hoogtelijnen er zijn, is het tijd om het grondoppervlak te kopiëren, om het vervolgens op de hoogtelijnen te plakken.



    Om het er realistisch uit te laten zien, verwijder je de achterste lijnen, die je normaal gezien bij een ruimtefiguur ook niet ziet.
    Dit is de uiteindelijke basisvorm.



    De opmaak
    Een basisvorm alleen stelt niet veel voor.
    Er kan nog zoveel aan gedaan worden.
    In dit geval kunnen er ramen, deuren, een schoorsteen en nog veel meer op het huisje gezet worden.
    We beginnen met een deur.

    De hoogtelijnen van de deur komen eerst. Deze moeten niet té hoog zijn, maar ook niet té laag.
    Denk er wel aan dat beide lijnen even hoog moeten zijn.



    Om de deur af te werken verbinden we de hoogtelijnen en zetten we er een klink op.



    Bij een raam heb je eerst weer een schuine lijn, en daar 2 hoogtelijnen op.
    Dan werk je af met een andere schuine lijn die paralel loopt met de onderste.



    Om het raampje een diepte te geven, zet je naast de linker hoogtelijn nog een hoogtelijn.



    Kopieer dit raampje en plak het neer waar je nog raampjes wilt.



    Als je aan de andere kant van het gebouw ook raampjes wilt, kun je deze niet gewoon daar plakken.
    Want die raampjes worden bekeken uit een ander perspectief.
    Daarnaast staat het 3de hoogtelijntje, dat zorgt voor wat dieptezicht, aan de rechterkant.



    Kleuren
    Nu we raampjes en een deur hebben, is het tijd om deze pixelart in te kleuren.
    In tegenstelling tot Pokémon sprites, waar het licht altijd links schijnt, schijnt het licht hier rechts.
    Dus de lichtere kleuren moeten rechts komen.



    De raampjes geven we ook een kleur.
    Let op, het raam aan de rechterkant krijgt een lichtere kleur dan die aan de linkerkant.
    De witruimte tussen de twee hoogtelijnen krijgt een nog donkere kleur.



    De deur krijgt een grijze kleur. Anders zit er teveel bruin in de pixelart.
    Maar dat is mijn mening.



    De outline
    Het is niet noodzakelijk om de outline aan te passen, maar het staat wel beter.
    Het is de bedoeling om een donkere kleur te kiezen uit het kleurenpallet van het deel waarvan je de outline wilt aanpassen.
    In dit geval doe ik eerst het huis zelf.



    Daarna volgen de ramen. De derde hoogtelijn, die voor dieptezicht zorgde, krijgt een nog donkerdere kleur.



    De deur krijg een grijze outline.
    De klink mag ook dezelfde kleur als de outline krijgen.



    Eindresultaat



    Tip
    Gebruik nooit de standaard kleuren van paint. behalve voor het zwart.

    Verbeteringen of opmerkingen zijn altijd welkom

    #2
    Re: Tutorial: Isometric Pixelart Basis

    Mooi gedaan, echt waar
    [spoiler:1kkpzeld][center:1kkpzeld]
    mijn ruiltopic | mijn pixels | Mijn vechttopic[/center:1kkpzeld]

    [txt=ik ben:1kkpzeld][/txt:1kkpzeld]
    [txt=guides:1kkpzeld]weather guide
    game corner guide
    baby pokemon guide
    prioriteit guide
    Darkrai tweaking
    amity square[/txt:1kkpzeld]
    [txt=awesome:1kkpzeld]-Staraptor
    -Qart.Jan
    -Janneke
    -Raiden
    -Versys
    -Bram.
    -Zinegirl
    -Jasper
    -Dry guy
    -Jij?
    -En ik vergeet er wel een paar[/txt:1kkpzeld][/spoiler:1kkpzeld]

    Opmerking


      #3
      Re: Tutorial: Isometric Pixelart Basis

      best een leuke tutorial

      outcome:


      (komen er ook nog andere tutorial aangezien er "basis" in staat?)

      Opmerking


        #4
        Re: Tutorial: Isometric Pixelart Basis

        Ja, bijvoorbeeld schuine daken in plaats van platte daken?
        [spoiler:1kkpzeld][center:1kkpzeld]
        mijn ruiltopic | mijn pixels | Mijn vechttopic[/center:1kkpzeld]

        [txt=ik ben:1kkpzeld][/txt:1kkpzeld]
        [txt=guides:1kkpzeld]weather guide
        game corner guide
        baby pokemon guide
        prioriteit guide
        Darkrai tweaking
        amity square[/txt:1kkpzeld]
        [txt=awesome:1kkpzeld]-Staraptor
        -Qart.Jan
        -Janneke
        -Raiden
        -Versys
        -Bram.
        -Zinegirl
        -Jasper
        -Dry guy
        -Jij?
        -En ik vergeet er wel een paar[/txt:1kkpzeld][/spoiler:1kkpzeld]

        Opmerking


          #5
          Re: Tutorial: Isometric Pixelart Basis

          Ja, er komen ook andere tutorials.
          Uitbreidingen op deze, bijv speciale technieken.

          Opmerking


            #6
            Re: Tutorial: Isometric Pixelart Basis

            het is zo stickman-achtig
            [spoiler:1kkpzeld][center:1kkpzeld]
            mijn ruiltopic | mijn pixels | Mijn vechttopic[/center:1kkpzeld]

            [txt=ik ben:1kkpzeld][/txt:1kkpzeld]
            [txt=guides:1kkpzeld]weather guide
            game corner guide
            baby pokemon guide
            prioriteit guide
            Darkrai tweaking
            amity square[/txt:1kkpzeld]
            [txt=awesome:1kkpzeld]-Staraptor
            -Qart.Jan
            -Janneke
            -Raiden
            -Versys
            -Bram.
            -Zinegirl
            -Jasper
            -Dry guy
            -Jij?
            -En ik vergeet er wel een paar[/txt:1kkpzeld][/spoiler:1kkpzeld]

            Opmerking


              #7
              Re: Tutorial: Isometric Pixelart Basis



              Outcome.

              Bedankt Janneke!

              Opmerking


                #8
                Re: Tutorial: Isometric Pixelart Basis

                Guido, probeer het een beetje ordelijk en symmetrisch te houden.
                Dit zorgt al voor een betere outcome.

                Opmerking


                  #9
                  Re: Tutorial: Isometric Pixelart Basis

                  Dit heb ik vorig jaar ook gedaan!

                  [spoiler:39cr073w]





                  [/spoiler:39cr073w]

                  ~Dreamscape~

                  Opmerking


                    #10
                    Re: Tutorial: Isometric Pixelart Basis

                    Beetje habbo-achtig.

                    Opmerking


                      #11
                      Re: Tutorial: Isometric Pixelart Basis

                      Oorspronkelijk gepost door zinegirl
                      Beetje habbo-achtig.
                      Je focking meent het, dit is dezelfde stijl die Habbo gebruikt. Dit is niet habbo-achtig, habbo is isometric pixelart achtig.

                      ~Dreamscape~

                      Opmerking


                        #12
                        Re: Tutorial: Isometric Pixelart Basis

                        Oorspronkelijk gepost door zinegirl
                        Beetje habbo-achtig.
                        FYI, Habbo = Isometric Pixelart.

                        Opmerking


                          #13
                          Re: Tutorial: Isometric Pixelart Basis

                          Nieuwe outcome.

                          Bedankt Janneke!

                          Opmerking


                            #14
                            Re: Tutorial: Isometric Pixelart Basis

                            Dat ziet er al veel beter uit guido.
                            Alleen moet je proberen dat je de hoeken wel vlotjes laat lopen.
                            En Alles is dezelfde kleur.
                            Hier moet je ook met shading werken... Net zoals je dat doet als je een Pokémon recollort.

                            Opmerking


                              #15
                              Re: Tutorial: Isometric Pixelart Basis

                              Leuk Bram! Misschien een hele stad maken?

                              Opmerking

                              Bezig...
                              X