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.
    • 1
      1337 @1337
      last edited by

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

      scottalanmillerS D 2 Replies Last reply Reply Quote 0
      • 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