ML
    • Recent
    • Categories
    • Tags
    • Popular
    • Users
    • Groups
    • Register
    • Login

    Web UI design tools

    Scheduled Pinned Locked Moved Developer Discussion
    cssuidesign
    17 Posts 6 Posters 1.3k Views
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • scottalanmillerS
      scottalanmiller @1337
      last edited by

      @Pete-S said in Web UI design tools:

      I also kind of assumed that Sketch would work with the CSS directly.

      That would be cool. But as CSS can be automatically generated and doesn't itself contain the components, I'm not sure what Sketch would be doing.

      1 Reply Last reply Reply Quote 0
      • 1
        1337
        last edited by 1337

        OK, after some searching I found that the equivalent tool for windows is Adobe XD. XD is cross platform but it's a vector based UI designer tool, like Sketch.

        It seems like since they are both general tools for UI design (apps, web, whatever) they are not specifically made for editing CSS, which I had hoped. Still useful though to get the design visually done, before working on the CSS.

        scottalanmillerS 1 Reply Last reply Reply Quote 0
        • scottalanmillerS
          scottalanmiller @1337
          last edited by

          @Pete-S said in Web UI design tools:

          OK, after some searching I found that the equivalent tool for windows is Adobe XD. XD is cross platform but it's a vector based UI designer tool, like Sketch.

          It seems like since they are both general tools for UI design (apps, web, whatever) they are not specifically made for editing CSS, which I had hoped. Still useful though to get the design visually done, before working on the CSS.

          Vector tools means that it is drawing app, which is for artists to envision an interface. But useless for making the interface itself. So for that, which is what I was wondering, Inkscape is the common choice.

          1 Reply Last reply Reply Quote 0
          • D
            dave_c @1337
            last edited by

            @Pete-S
            I'm not sure of the generated CSS quality. I mean, tools can generate CSS but it is usually "machine CSS", not something intended to be easily modifiable by the developer.
            I'm playing with Pinegrow, working directly on the HTML/CSS. I like it a lot.

            scottalanmillerS 1 Reply Last reply Reply Quote 0
            • scottalanmillerS
              scottalanmiller @dave_c
              last edited by

              @dave_c said in Web UI design tools:

              I'm playing with Pinegrow, working directly on the HTML/CSS. I like it a lot.

              Not too expensive. What are you making with it?

              D 1 Reply Last reply Reply Quote 0
              • D
                dave_c @scottalanmiller
                last edited by

                @scottalanmiller
                We are developing an Student information System for a customer. Pinegrow + VS Code are a nice combination

                jmooreJ 1 Reply Last reply Reply Quote 1
                • Emad RE
                  Emad R @stacksofplates
                  last edited by

                  @stacksofplates said in Web UI design tools:

                  I've always stayed away from these types of tools. They always add way more complexity/elements than are needed. Sticking with Frameworks like CSS Grid, Flexbox, Zurb, Bootstrap, etc and theming from those are cleaner IMO.

                  I think when you have clients and you wish to work with regarding the design and prototyping, you can use those tools to give them power to view and edit better . thats what i understood.

                  1 Reply Last reply Reply Quote 0
                  • jmooreJ
                    jmoore @dave_c
                    last edited by

                    @dave_c Just looked at Pinegrow and I think its interesting. Will try it out eventually.

                    D 1 Reply Last reply Reply Quote 0
                    • D
                      dave_c @jmoore
                      last edited by

                      @jmoore
                      I am not a designer, I am a programmer. But when doing web based software I like to see what I am coding while I am coding it. Pinegrow is wonderful for that. You have access to the full power of HTML & CSS
                      And it is great if you use Bootstrap or Foundation because it has full support for them. I prefer Bulma, and it works well with it because Pinegrow is a general purpose tool.
                      I will stop now, as I feel like I am selling something

                      jmooreJ 1 Reply Last reply Reply Quote 0
                      • jmooreJ
                        jmoore @dave_c
                        last edited by

                        @dave_c lol, thanks for the insight though. I love a good tool

                        1 Reply Last reply Reply Quote 0
                        • 1 / 1
                        • First post
                          Last post