• Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Register
  • Login
UBports Robot Logo UBports Forum
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Register
  • Login

Icon Library

Scheduled Pinned Locked Moved Design
108 Posts 11 Posters 30.0k Views 2 Watching
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.
    • ? Offline
      A Former User
      last edited by A Former User 29 Aug 2020, 13:00

      This is what I would use! From my point of view it has all it needs: it suggest what it does, it's well balanced, stands out but not disturbing, lower grey area is more softy, the upper black-red area is more aggressive to show warning,
      datamonitor6a.png

      Softened variant.
      datamonitor6b.png

      1 Reply Last reply Reply Quote 0
      • ? Offline
        A Former User
        last edited by 29 Aug 2020, 14:16

        This post is deleted!
        1 Reply Last reply Reply Quote 0
        • M Offline
          matteo @Guest
          last edited by 29 Aug 2020, 14:38

          @C0n57an71n personally I like the one with the background transparent grid the most, I think it gives a professionality touch to the app but I see some of you disliked this concept. However, since I designed this app to learn coding for UT and not secondarily to fill a gap I felt our beloved OS got, i.e. the lack of feature for metering the data usage, all for the UBports Community, I'd like to adopt the icon which will result the most popular one, or at least to identify the most promising one to be considered as basis for last tinkering by @C0n57an71n, if needed.

          ? 1 Reply Last reply 7 Sept 2020, 09:46 Reply Quote 0
          • M Offline
            matteo
            last edited by 30 Aug 2020, 09:26

            ICON N.3 rendering:
            photo_2020-08-30_11-24-58.jpg

            1 Reply Last reply Reply Quote 0
            • M Offline
              matteo
              last edited by 30 Aug 2020, 09:34

              ICON N.4 rendering (the one with background grid):
              photo_2020-08-30_11-32-58.jpg

              1 Reply Last reply Reply Quote 0
              • M Offline
                matteo
                last edited by 30 Aug 2020, 09:55

                ICON N.5 rendering (last version by @C0n57an71n:
                photo_2020-08-30_11-53-55.jpg

                ? 1 Reply Last reply 30 Aug 2020, 10:30 Reply Quote 0
                • ? Offline
                  A Former User @matteo
                  last edited by 30 Aug 2020, 10:30

                  @matteo Where do you change the app logo (I mean the path.) I would like test them myself before posting them, just to make sure they are in proportion.

                  M 1 Reply Last reply 30 Aug 2020, 13:49 Reply Quote 0
                  • M Offline
                    matteo @Guest
                    last edited by 30 Aug 2020, 13:49

                    @C0n57an71n I use clickable to change the icon compiling the app straight on the device. The icon is stored as a .png file in the Assets folder. Perhaps you could just create a new dummy project with the standard app template creator provided by clickable and replace there the icon, only to see its rendering...

                    A 1 Reply Last reply 30 Aug 2020, 17:53 Reply Quote 0
                    • A Offline
                      AppLee @matteo
                      last edited by 30 Aug 2020, 17:53

                      @matteo said in Icon Library:

                      The icon is stored as a .png file in the Assets folder.

                      You can use SVG directly, you'll have better result scaling it...
                      On the device (without compiling it yourself) it should be in something like:
                      /opt/click.ubuntu.com/XXX.YYY/current/ with XXX.YYY being the app identifier.

                      M 1 Reply Last reply 31 Aug 2020, 16:35 Reply Quote 0
                      • M Offline
                        matteo @AppLee
                        last edited by matteo 31 Aug 2020, 16:35

                        @AppLee thank you for the pointer. I'm not familiar with SVG format at all but I'm looking forward to employing it, foremost if it is convenient and it brings advantages as you said over the PNG format, but I don't know a thing about implications for a graphical artist in terms of time consuming to preparing that or the software to be used, so I leave to @C0n57an71n the evaluation whether to adopt this format or not.

                        A ? 2 Replies Last reply 31 Aug 2020, 16:41 Reply Quote 0
                        • A Offline
                          AppLee @matteo
                          last edited by 31 Aug 2020, 16:41

                          @matteo
                          Sure, I bet @C0n57an71n is already working with SVG.
                          This is a vector image format which means it uses mathematical formulas to describe visual features (circles, triangles, rectangles, bezier curves, etc.)
                          In the open world, one of the best tool is inkscape if you're interested and it's not that hard to learn and use it...

                          Long time user of the Gimp, I'm slowly learning how to master basic features of Inkscape.

                          PNG works fine, SVG is more versatile even if it has limitations... 😉

                          1 Reply Last reply Reply Quote 1
                          • ? Offline
                            A Former User @matteo
                            last edited by A Former User 31 Aug 2020, 16:49

                            @matteo The easy way to distinguish is when you zoom in: a graphical/vector like SVG/Inkscape will keep it's details because you are changing some proportions and the display will adapt and cover those changes and thus: no loss in details. On the other hand, a 256x256 pixels PNG, when zoom in... So... yeah SVG is better. But if you want to be artistic and use brushes etc, than Gimp, Krita are some good choices. For 3D is Blender.

                            M 1 Reply Last reply 31 Aug 2020, 18:25 Reply Quote 1
                            • M Offline
                              matteo @Guest
                              last edited by 31 Aug 2020, 18:25

                              @C0n57an71n deal then 😉 let's do it with SVG.

                              1 Reply Last reply Reply Quote 0
                              • ? Offline
                                A Former User @matteo
                                last edited by 7 Sept 2020, 09:46

                                @matteo I was thinking, since so many people have different opinions and like different icons, why not give the user the option to choose it. Have your app in OpenStore with the icon that you like, but when the user had installed your app, has the option to change the icon.

                                M 1 Reply Last reply 7 Sept 2020, 17:39 Reply Quote 0
                                • M Offline
                                  matteo @Guest
                                  last edited by matteo 9 Jul 2020, 17:40 7 Sept 2020, 17:39

                                  @C0n57an71n not sure if this is even possible to get since as far as I understand the app icon is hard-coded once the app is compiled. But I'm not the best to tell you about the insight behind that.
                                  Instead, I think that since it seems the discussion is too quite and nobody voted so far on the different rendering of icons, I wish to give you my preferred guide lines to be followed to draw the best icon, in my humble opinion:

                                  1. I''m still preferring the look of the rendered ICON N.4, with the grid shown in transparency; maybe I'd provide the deep green color to the grid and more evidence to it (therefore less transparency), in order to look more "Matrix"ish;
                                  2. I like the dots at the bottom row, to ideally recall the days numbers;
                                  3. I don't really mind colors gradient for the columns, but they look like randomly set for each column (extent of the gradient): perhaps we could adjust that in order to have a consistent approach?
                                  4. On top of the last column, I still prefer having the rectangle more than the triangle shape, for it seems to me more discreet;
                                  5. Sure style with a fold-able side is perfect.

                                  Thank you.

                                  Matteo

                                  1 Reply Last reply Reply Quote 0
                                  103 out of 108
                                  • First post
                                    103/108
                                    Last post