Modifying playground icons for you?

This is a post concerning the playground.

For fun, Started to modify the SVG of the icons used in the playground by adding some clarity colors to it. Asking you guys if I should further modify them all… to be added in the playground BUT I noticed how the SVGs way they are made is inconsistent.

In bref, do you know if it’s possible to put in some static color for example: a green fill for the play button, blue diskette save button, grey options button, etc?
OR anyone know if the app change the group tag fill color value of the SVG?

OH and I’m feeling good I only use JS not TS. . . so much red :c
BTW: I loved how someone added DARK THEME TO THE DOCS! :smiley:
Just wish I could help more maybe with these icons?

2 Likes

You should feel exactly the opposite! :slight_smile:

I’m very curious what could you come up with! Any screenshot available already?

I read a few days/weeks ago that there are plans for a brand new Playground led by @PatrickRyan You could talk to him about the new icons.

1 Like

Thanks for that :hugs:, We are forever in need of more people wanting to contribute. May be you could start by sharing your icons with us? Though, I sure don’t want to play the advocate of the devil here :imp: :face_with_hand_over_mouth: or discourage you from contributing in enhancing the experience/interface (not at all, trust me :innocent:), however… as per my ‘small’ experience (of creating many icon sets over 30 years of design)…‘color coding’ is mostly not just global; It’s also culture based and regional. In essence, the visual representation (shape and design) of the icon takes over, at least, at a global scale. Changing the color to blue or green has only very little impact (again, in my opinion). I believe the choice of icon design in the interface are mostly fairly representative of what is commonly known :thinking: (again, at a global level… again, in my opinion :wink:).
I’m not saying :zipper_mouth_face:…there’s always space for improvement :nerd_face:. Reason why I’d say: Before pushing this all too far, may be just let us (and the Team) have a look at these icons?

Thanks again for your enthusiasm and your will to contribute and meanwhile,… have a great sunday :sunglasses:

2 Likes

Speaking of which…

This is like extinguishing a fire by turning off the fire alarm. :upside_down_face:

2 Likes

:rofl: :joy: :rofl: Hahaha! You made my day with this comment… I barely could recover from laughing :laughing: Mind my old heart :older_adult: :stethoscope:, will you?:sweat_smile:

2 Likes

It’s sunday (and holidays? :beach_umbrella:), right ? …So, I thought I could laugh a little longer with this meme (note @SkyOps117 , we’re not laughing at you… not at all… it’s mostly a private joke and to be honest, I’m only learning typescript now :face_with_hand_over_mouth:… just don’t tell anyone :grin: :joy:


2 Likes

Dont worry @SkyOps117 , i will be on your side for regular JS , I recently read this online :

If there is hard statistical data that using untyped JavaScript vs. TypeScript means that productivity decreases by any significant amount (if at all), then I wouldn’t mind the verbosity of TypeScript.

However, there is no such evidence, and quite frankly, I personally am convinced that untyped JavaScript is more productive.

( ps i can code other languages , like c# and i know the arguments for types and interfaces and generics etc… , i just dont care to want to have to create so much extra code … )

anyway , to the topic on hand, i personally would not like the icons to have different colours. To me, that design style is dated. The current uniform highlight colour is good modern design

Types prevents property misstyping thus reduces ‘hardly’ debuggable errors. Honestly, how many times do you misstype a property name in JS and wonder wtf is it not working? :smiley:

… i copy and paste the variables … :grin:

i know im stirring the pot and i did mention i understand the benefits due to knowing c# from working with Unity engine. Regardless i find im capable of living perfectly fine without them.

Maybe if I was creating huge code bases and API’s that had many many other developers working with it , sure. But I dont work in that context.

I can still follow the principles of an interface logic , without the compiler enforcing it, and without having to create the extra interface code… im the only one working on my code.

( and if someone else has to work on it when i die … AI will probably be able transpile it to typescript or whatever else pretty soon )

DO NOT BUDDY! :heart_eyes_cat:

1 Like

Did you want to hurt yourself because deep inside you can sense the superiority of TS? :smiley:

image

Sorry OP , slightly derailing your thread … im sure someone will get back on topic soon :wink:

3 Likes

Not any but unknown :sunglasses::saluting_face::see_no_evil:

1 Like

Sure will show what I did a day ago :smiley:
save

The code:

<!-- DISK SVG -->
<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
  width="24" height="24">

  <!-- OUTTER OUTLINE -->
  <path fill="none" stroke="#ffffff" stroke-width="2"
    d="M15.65,2 C15.9717273,2 16.2675997,2.02771153 16.5001858,2.25 L21.6298279,6.75 C21.8765897,6.98583653 22,7.30866402 22,7.65 L22,19.25 C22,20.4926407 20.9926407,21.5 19.75,21.5 L4.25,21.5 C3.00735931,21.5 2,20.4926407 2,19.25 L2,4.25 C2,3.00735931 3.00735931,2 4.25,2 L15.65,2 Z" />

  <!-- BACKGORUND -->
  <path fill="#0080ff"
    d="M6,3.499 L4.25,3.5 C3.83578644,3.5 3.5,3.83578644 3.5,4.25 L3.5,19.25 C3.5,19.6642136 3.83578644,20 4.25,20 L5,20 L5,14.25 C5,13.3318266 5.70711027,12.5788077 6.60647279,12.5058012 L6.75,12.5 L17.2845336,12.5 C18.202707,12.5 18.9245594,13.2433143 18.9944492,14.1462973 L19,14.2901153 L19,20 L19.75,20 C20.1642136,20 20.5,19.6642136 20.5,19.25 L20.5,7.76609146 L15.5362794,3.5 L15.5,3.499 L15.5,6.75249137 C15.5,7.71898968 14.7164983,8.50249137 13.75,8.50249137 L7.75,8.50249137 C6.78350169,8.50249137 6,7.71898968 6,6.75249137 L6,3.499 Z" />

  <!-- CONNECTOR -->
  <path fill="#cccccc"
    d="M14,3.499 L7.5,3.499 L7.5,6.75249137 C7.5,6.89056256 7.61192881,7.00249137 7.75,7.00249137 L13.75,7.00249137 C13.8880712,7.00249137 14,6.89056256 14,6.75249137 L14,3.499 Z" />

  <!-- WHITEPAD -->
  <path fill="#ffffff"
    d="M17.2845336,14 L6.75,14 C6.63165327,14 6.53251318,14.0822334 6.50660268,14.1926773 L6.5,14.25 L6.5,20 L17.5,20 L17.5,14.25 C17.5,14.1349407 17.4462533,14.0380358 17.3484354,14.0089302 L17.2845336,14 Z " />

  <!-- BASE OUTLINE -->
  <path fill="#000000"
    d="M15.65,2 C15.9717273,2 16.2675997,2.02771153 16.5001858,2.25 L21.6298279,6.75 C21.8765897,6.98583653 22,7.30866402 22,7.65 L22,19.25 C22,20.4926407 20.9926407,21.5 19.75,21.5 L4.25,21.5 C3.00735931,21.5 2,20.4926407 2,19.25 L2,4.25 C2,3.00735931 3.00735931,2 4.25,2 L15.65,2 Z M6,3.499 L4.25,3.5 C3.83578644,3.5 3.5,3.83578644 3.5,4.25 L3.5,19.25 C3.5,19.6642136 3.83578644,20 4.25,20 L5,20 L5,14.25 C5,13.3318266 5.70711027,12.5788077 6.60647279,12.5058012 L6.75,12.5 L17.2845336,12.5 C18.202707,12.5 18.9245594,13.2433143 18.9944492,14.1462973 L19,14.2901153 L19,20 L19.75,20 C20.1642136,20 20.5,19.6642136 20.5,19.25 L20.5,7.76609146 L15.5362794,3.5 L15.5,3.499 L15.5,6.75249137 C15.5,7.71898968 14.7164983,8.50249137 13.75,8.50249137 L7.75,8.50249137 C6.78350169,8.50249137 6,7.71898968 6,6.75249137 L6,3.499 Z M17.2845336,14 L6.75,14 C6.63165327,14 6.53251318,14.0822334 6.50660268,14.1926773 L6.5,14.25 L6.5,20 L17.5,20 L17.5,14.25 C17.5,14.1349407 17.4462533,14.0380358 17.3484354,14.0089302 L17.2845336,14 Z M14,3.499 L7.5,3.499 L7.5,6.75249137 C7.5,6.89056256 7.61192881,7.00249137 7.75,7.00249137 L13.75,7.00249137 C13.8880712,7.00249137 14,6.89056256 14,6.75249137 L14,3.499 Z" />

</svg>

play

<!-- PLAY BUTTON SVG -->
<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
  width="256" height="256">

  <!-- OUTTER OUTLINE -->
  <path fill="none" stroke="#ffffff" stroke-width="2"
    d="M6.33994976,2.27500912 C5.25284495,1.67304649 3.88358525,2.06633193 3.28162262,3.15343674 C3.09690734,3.48702035 3,3.86207592 3,4.2433865 L3,19.7591388 C3,21.0017795 4.00735931,22.0091388 5.25,22.0091388 C5.63140051,22.0091388 6.00654154,21.9121858 6.34018202,21.7273876 L20.3484443,13.9684314 C21.4354781,13.3663405 21.8286019,11.9970344 21.226511,10.9100006 C21.0219396,10.540661 20.7175758,10.2363331 20.348212,10.0318053 L6.33994976,2.27500912 Z" />

  <!-- BACKGROUND -->
  <path fill="#00ee00"
    d="M6.33994976,2.27500912 C5.25284495,1.67304649 3.88358525,2.06633193 3.28162262,3.15343674 C3.09690734,3.48702035 3,3.86207592 3,4.2433865 L3,19.7591388 C3,21.0017795 4.00735931,22.0091388 5.25,22.0091388 C5.63140051,22.0091388 6.00654154,21.9121858 6.34018202,21.7273876 L20.3484443,13.9684314 C21.4354781,13.3663405 21.8286019,11.9970344 21.226511,10.9100006 C21.0219396,10.540661 20.7175758,10.2363331 20.348212,10.0318053 L6.33994976,2.27500912 Z" />

  <!-- OUTLINE -->
  <path fill="#212121"
    d="M6.33994976,2.27500912 C5.25284495,1.67304649 3.88358525,2.06633193 3.28162262,3.15343674 C3.09690734,3.48702035 3,3.86207592 3,4.2433865 L3,19.7591388 C3,21.0017795 4.00735931,22.0091388 5.25,22.0091388 C5.63140051,22.0091388 6.00654154,21.9121858 6.34018202,21.7273876 L20.3484443,13.9684314 C21.4354781,13.3663405 21.8286019,11.9970344 21.226511,10.9100006 C21.0219396,10.540661 20.7175758,10.2363331 20.348212,10.0318053 L6.33994976,2.27500912 Z M19.9143452,11.6367887 C20.1150422,11.9991333 19.9840009,12.4555686 19.6216563,12.6562656 L5.61339401,20.4152217 C5.50218051,20.4768211 5.3771335,20.5091388 5.25,20.5091388 C4.83578644,20.5091388 4.5,20.1733524 4.5,19.7591388 L4.5,4.2433865 C4.5,4.11628298 4.53230245,3.99126445 4.59387421,3.88006992 C4.79452842,3.51770165 5.25094832,3.3866065 5.61331659,3.58726071 L19.6215789,11.3440569 C19.7447001,11.4122328 19.8461547,11.5136755 19.9143452,11.6367887 Z" />

</svg>

options

<!-- OPTIONS SVG  -->
<svg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
  width="256" height="256">

  <!-- OUTTER OUTLINE -->
  <path fill="none" stroke="#ffffff" stroke-width="2"
    d="M12.0124778,2.25004981 C12.7464561,2.25850931 13.4775625,2.34331189 14.1939893,2.50308791 C14.5067308,2.57283489 14.7406198,2.83356075 14.7761194,3.15201278 L14.9463241,4.67885731 C15.0233647,5.37990957 15.6152692,5.91089096 16.3209275,5.91163079 C16.5105994,5.91192723 16.6982236,5.8724274 16.8734931,5.79488275 L18.2741165,5.17960888 C18.5654231,5.05164206 18.9057701,5.12140804 19.1232362,5.35366556 C20.1354163,6.43469153 20.8892426,7.73119861 21.327994,9.14563241 C21.4226025,9.45062817 21.3137138,9.78208282 21.0566646,9.9715529 L19.8151844,10.8866429 C19.4610446,11.1468395 19.2518879,11.5600547 19.2518879,11.9995059 C19.2518879,12.438957 19.4610446,12.8521723 19.8159631,13.1129417 L21.0585161,14.0283492 C21.3156542,14.2177866 21.424614,14.5492871 21.3300078,14.8543382 C20.8914192,16.2685371 20.1380215,17.5649441 19.1264267,18.6461445 C18.9091604,18.8783604 18.5690663,18.9483128 18.2777879,18.8206973 L16.8714553,18.2045515 C16.4691374,18.0284918 16.0070651,18.0542838 15.62684,18.2740235 C15.2466148,18.4937632 14.9935731,18.8812498 14.9452542,19.3177822 L14.776179,20.8444618 C14.7413156,21.1592635 14.5124557,21.4182309 14.2043301,21.4915398 C12.7558808,21.8361534 11.2467854,21.8361534 9.79833608,21.4915398 C9.49021045,21.4182309 9.26135058,21.1592635 9.22648722,20.8444618 L9.0576652,19.3200377 C9.00807734,18.8843357 8.75464533,18.4980265 8.37472926,18.2790311 C7.99481318,18.0600358 7.53350779,18.0343481 7.13250482,18.2094252 L5.7258787,18.8256995 C5.43452472,18.9533482 5.0943393,18.8833238 4.87708632,18.6509825 C3.86492915,17.5685306 3.11149836,16.270585 2.67350518,14.8548427 C2.57916657,14.5499084 2.688166,14.2186739 2.94515048,14.0293496 L4.18848222,13.1133693 C4.54262206,12.8531727 4.75177873,12.4399574 4.75177873,12.0005063 C4.75177873,11.5610552 4.54262206,11.1478399 4.18801888,10.8873026 L2.94546579,9.97289561 C2.68810018,9.78349773 2.57900047,9.45183111 2.67367169,9.14663286 C3.11242314,7.73219906 3.8662494,6.43569197 4.87842956,5.35466601 C5.09589562,5.12240848 5.43624261,5.0526425 5.72754921,5.18060933 L7.12792442,5.79577421 C7.53086629,5.97260708 7.9941044,5.94589569 8.37607497,5.7227409 C8.75639478,5.50213708 9.00959105,5.1142722 9.05847199,4.67769189 L9.2285477,3.15201278 C9.26406522,2.83339973 9.49816738,2.57259043 9.81110802,2.5029921 C10.528382,2.34346958 11.2602557,2.25870353 12.0124778,2.25004981 Z" />

  <!-- CENTER BACKGROUND -->
  <path fill="#bbbbbb"
    d="M12.0124778,2.25004981 C12.7464561,2.25850931 13.4775625,2.34331189 14.1939893,2.50308791 C14.5067308,2.57283489 14.7406198,2.83356075 14.7761194,3.15201278 L14.9463241,4.67885731 C15.0233647,5.37990957 15.6152692,5.91089096 16.3209275,5.91163079 C16.5105994,5.91192723 16.6982236,5.8724274 16.8734931,5.79488275 L18.2741165,5.17960888 C18.5654231,5.05164206 18.9057701,5.12140804 19.1232362,5.35366556 C20.1354163,6.43469153 20.8892426,7.73119861 21.327994,9.14563241 C21.4226025,9.45062817 21.3137138,9.78208282 21.0566646,9.9715529 L19.8151844,10.8866429 C19.4610446,11.1468395 19.2518879,11.5600547 19.2518879,11.9995059 C19.2518879,12.438957 19.4610446,12.8521723 19.8159631,13.1129417 L21.0585161,14.0283492 C21.3156542,14.2177866 21.424614,14.5492871 21.3300078,14.8543382 C20.8914192,16.2685371 20.1380215,17.5649441 19.1264267,18.6461445 C18.9091604,18.8783604 18.5690663,18.9483128 18.2777879,18.8206973 L16.8714553,18.2045515 C16.4691374,18.0284918 16.0070651,18.0542838 15.62684,18.2740235 C15.2466148,18.4937632 14.9935731,18.8812498 14.9452542,19.3177822 L14.776179,20.8444618 C14.7413156,21.1592635 14.5124557,21.4182309 14.2043301,21.4915398 C12.7558808,21.8361534 11.2467854,21.8361534 9.79833608,21.4915398 C9.49021045,21.4182309 9.26135058,21.1592635 9.22648722,20.8444618 L9.0576652,19.3200377 C9.00807734,18.8843357 8.75464533,18.4980265 8.37472926,18.2790311 C7.99481318,18.0600358 7.53350779,18.0343481 7.13250482,18.2094252 L5.7258787,18.8256995 C5.43452472,18.9533482 5.0943393,18.8833238 4.87708632,18.6509825 C3.86492915,17.5685306 3.11149836,16.270585 2.67350518,14.8548427 C2.57916657,14.5499084 2.688166,14.2186739 2.94515048,14.0293496 L4.18848222,13.1133693 C4.54262206,12.8531727 4.75177873,12.4399574 4.75177873,12.0005063 C4.75177873,11.5610552 4.54262206,11.1478399 4.18801888,10.8873026 L2.94546579,9.97289561 C2.68810018,9.78349773 2.57900047,9.45183111 2.67367169,9.14663286 C3.11242314,7.73219906 3.8662494,6.43569197 4.87842956,5.35466601 C5.09589562,5.12240848 5.43624261,5.0526425 5.72754921,5.18060933 L7.12792442,5.79577421 C7.53086629,5.97260708 7.9941044,5.94589569 8.37607497,5.7227409 C8.75639478,5.50213708 9.00959105,5.1142722 9.05847199,4.67769189 L9.2285477,3.15201278 C9.26406522,2.83339973 9.49816738,2.57259043 9.81110802,2.5029921 C10.528382,2.34346958 11.2602557,2.25870353 12.0124778,2.25004981 Z" />

  <!-- OUTTER BACKGROUND -->
  <path fill="#808080"
  d="M12.0126647,3.74994801 C11.5586248,3.75529426 11.1058626,3.79447802 10.6581282,3.86706495 L10.5491978,4.84423461 C10.4473682,5.75372759 9.92033793,6.56107177 9.1307238,7.01908176 C8.33627573,7.48322292 7.36766706,7.53907517 6.52488669,7.16921711 L5.62659688,6.77461123 C5.05466409,7.4687762 4.59944511,8.25140361 4.27882526,9.09173245 L5.07662396,9.67884052 C5.815434,10.2216652 6.25177873,11.083719 6.25177873,12.0005063 C6.25177873,12.9172936 5.815434,13.7793474 5.07740261,14.3215992 L4.27834975,14.9102735 C4.59869009,15.7520832 5.05398125,16.5361738 5.62630503,17.2316774 L6.53143729,16.8351192 C7.36953,16.4692082 8.33154713,16.5227779 9.12383307,16.979476 C9.91611902,17.4361742 10.4446321,18.2417923 10.548297,19.1526711 L10.6572578,20.1365419 C11.546902,20.2878194 12.4557641,20.2878194 13.3454083,20.1365419 L13.4543643,19.1527147 C13.5551575,18.2421074 14.0830557,17.433729 14.8762852,16.9753059 C15.6695147,16.5168827 16.6334944,16.4630752 17.4731076,16.8305011 L18.3775251,17.2267466 C18.94933,16.5323272 19.4044378,15.7495077 19.724985,14.9090277 L18.9270427,14.3211717 C18.1882326,13.778347 17.7518879,12.9162932 17.7518879,11.9995059 C17.7518879,11.0827186 18.1882326,10.2206648 18.9261146,9.67852303 L19.7229974,9.09114331 C19.402369,8.25065824 18.9470946,7.46788844 18.3750682,6.77361003 L17.4785957,7.16741578 C17.1132613,7.329057 16.7180786,7.41225335 16.3189691,7.41162946 C14.8492845,7.41008883 13.6158417,6.30360096 13.4554292,4.84387563 L13.3465034,3.86674729 C12.9009715,3.79424709 12.45294,3.75516877 12.0126647,3.74994801 Z M12,8.25 C14.0710678,8.25 15.75,9.92893219 15.75,12 C15.75,14.0710678 14.0710678,15.75 12,15.75 C9.92893219,15.75 8.25,14.0710678 8.25,12 C8.25,9.92893219 9.92893219,8.25 12,8.25 Z" />
  
  <!-- BASE OUTLINE -->
  <path fill="#212121"
    d="M12.0124778,2.25004981 C12.7464561,2.25850931 13.4775625,2.34331189 14.1939893,2.50308791 C14.5067308,2.57283489 14.7406198,2.83356075 14.7761194,3.15201278 L14.9463241,4.67885731 C15.0233647,5.37990957 15.6152692,5.91089096 16.3209275,5.91163079 C16.5105994,5.91192723 16.6982236,5.8724274 16.8734931,5.79488275 L18.2741165,5.17960888 C18.5654231,5.05164206 18.9057701,5.12140804 19.1232362,5.35366556 C20.1354163,6.43469153 20.8892426,7.73119861 21.327994,9.14563241 C21.4226025,9.45062817 21.3137138,9.78208282 21.0566646,9.9715529 L19.8151844,10.8866429 C19.4610446,11.1468395 19.2518879,11.5600547 19.2518879,11.9995059 C19.2518879,12.438957 19.4610446,12.8521723 19.8159631,13.1129417 L21.0585161,14.0283492 C21.3156542,14.2177866 21.424614,14.5492871 21.3300078,14.8543382 C20.8914192,16.2685371 20.1380215,17.5649441 19.1264267,18.6461445 C18.9091604,18.8783604 18.5690663,18.9483128 18.2777879,18.8206973 L16.8714553,18.2045515 C16.4691374,18.0284918 16.0070651,18.0542838 15.62684,18.2740235 C15.2466148,18.4937632 14.9935731,18.8812498 14.9452542,19.3177822 L14.776179,20.8444618 C14.7413156,21.1592635 14.5124557,21.4182309 14.2043301,21.4915398 C12.7558808,21.8361534 11.2467854,21.8361534 9.79833608,21.4915398 C9.49021045,21.4182309 9.26135058,21.1592635 9.22648722,20.8444618 L9.0576652,19.3200377 C9.00807734,18.8843357 8.75464533,18.4980265 8.37472926,18.2790311 C7.99481318,18.0600358 7.53350779,18.0343481 7.13250482,18.2094252 L5.7258787,18.8256995 C5.43452472,18.9533482 5.0943393,18.8833238 4.87708632,18.6509825 C3.86492915,17.5685306 3.11149836,16.270585 2.67350518,14.8548427 C2.57916657,14.5499084 2.688166,14.2186739 2.94515048,14.0293496 L4.18848222,13.1133693 C4.54262206,12.8531727 4.75177873,12.4399574 4.75177873,12.0005063 C4.75177873,11.5610552 4.54262206,11.1478399 4.18801888,10.8873026 L2.94546579,9.97289561 C2.68810018,9.78349773 2.57900047,9.45183111 2.67367169,9.14663286 C3.11242314,7.73219906 3.8662494,6.43569197 4.87842956,5.35466601 C5.09589562,5.12240848 5.43624261,5.0526425 5.72754921,5.18060933 L7.12792442,5.79577421 C7.53086629,5.97260708 7.9941044,5.94589569 8.37607497,5.7227409 C8.75639478,5.50213708 9.00959105,5.1142722 9.05847199,4.67769189 L9.2285477,3.15201278 C9.26406522,2.83339973 9.49816738,2.57259043 9.81110802,2.5029921 C10.528382,2.34346958 11.2602557,2.25870353 12.0124778,2.25004981 Z M12.0126647,3.74994801 C11.5586248,3.75529426 11.1058626,3.79447802 10.6581282,3.86706495 L10.5491978,4.84423461 C10.4473682,5.75372759 9.92033793,6.56107177 9.1307238,7.01908176 C8.33627573,7.48322292 7.36766706,7.53907517 6.52488669,7.16921711 L5.62659688,6.77461123 C5.05466409,7.4687762 4.59944511,8.25140361 4.27882526,9.09173245 L5.07662396,9.67884052 C5.815434,10.2216652 6.25177873,11.083719 6.25177873,12.0005063 C6.25177873,12.9172936 5.815434,13.7793474 5.07740261,14.3215992 L4.27834975,14.9102735 C4.59869009,15.7520832 5.05398125,16.5361738 5.62630503,17.2316774 L6.53143729,16.8351192 C7.36953,16.4692082 8.33154713,16.5227779 9.12383307,16.979476 C9.91611902,17.4361742 10.4446321,18.2417923 10.548297,19.1526711 L10.6572578,20.1365419 C11.546902,20.2878194 12.4557641,20.2878194 13.3454083,20.1365419 L13.4543643,19.1527147 C13.5551575,18.2421074 14.0830557,17.433729 14.8762852,16.9753059 C15.6695147,16.5168827 16.6334944,16.4630752 17.4731076,16.8305011 L18.3775251,17.2267466 C18.94933,16.5323272 19.4044378,15.7495077 19.724985,14.9090277 L18.9270427,14.3211717 C18.1882326,13.778347 17.7518879,12.9162932 17.7518879,11.9995059 C17.7518879,11.0827186 18.1882326,10.2206648 18.9261146,9.67852303 L19.7229974,9.09114331 C19.402369,8.25065824 18.9470946,7.46788844 18.3750682,6.77361003 L17.4785957,7.16741578 C17.1132613,7.329057 16.7180786,7.41225335 16.3189691,7.41162946 C14.8492845,7.41008883 13.6158417,6.30360096 13.4554292,4.84387563 L13.3465034,3.86674729 C12.9009715,3.79424709 12.45294,3.75516877 12.0126647,3.74994801 Z M12,8.25 C14.0710678,8.25 15.75,9.92893219 15.75,12 C15.75,14.0710678 14.0710678,15.75 12,15.75 C9.92893219,15.75 8.25,14.0710678 8.25,12 C8.25,9.92893219 9.92893219,8.25 12,8.25 Z M12,9.75 C10.7573593,9.75 9.75,10.7573593 9.75,12 C9.75,13.2426407 10.7573593,14.25 12,14.25 C13.2426407,14.25 14.25,13.2426407 14.25,12 C14.25,10.7573593 13.2426407,9.75 12,9.75 Z" />

</svg>

TS folks, they be still typing the type value where I would just use 3 type at all? :sweat_smile:

const TypeJS = [Number, String, Object];
console.log("Change my mind we only need 3 type like \r\n" + TypeJS);
1 Like

Ok, had a look at the icons, but (sorry :pray:) I’m still not convinced. First, if you use a black stroke, what would be the color of the bar?
Then, these colors are also very ‘basic’. There’s no real sense of ‘graphic design’. I mean, let me make this clear: For each ‘graphic design’ created for a brand/company, we are not just making ‘design’. We are essentially making design to support (eventually ‘sublime’, if possible) a ‘brand identity’.
Fact is, I cannot sense the ‘microsoft’ nor ‘babylon.js’ identity in these changes (Again, my opinion only. And again, sorry if this is not just what you wanted to read).
I mean, I’m simply honestly sharing my AD position/xp in graphic design opinion. Take it or leave it. To me, in this business, we are not doing ‘art’, we’re doing ‘business’. As I often told my apprentices or juniors: “If you want to make art and your own creations… Become a painter :art:, a writer :open_book: or a composer :notes:! Anything but a "graphic designer:face_with_hand_over_mouth:

1 Like

yes i mentioned in my post that the current uniform highlight color is good modern ui design. Probably not something the OP wants to hear but my opinion is also based on professional experience. So personally I would strongly disagree with having the icons changed to these colored ones.

2 Likes

@SkyOps117 I was just reading our answers again and… just to make this clear: Neither me (nor I believe anyone here) wanted to be ‘rude’ :pray:). I know it might feel ‘frustrating’ when you engage/commit to a project and then you get a sort of negativ feedback. Honestly, I get this seven times out of ten :sweat_smile:.

On the other hand, I believe it wouldn’t be fair to let you continue spend time and efforts on something which has only little (very little) chance to make it through. I’m sure your skills and enthusiasm can be put to much better use.

There’s plenty to improve here and there’s also plenty for you to experience and make your own personal projects where you can unleash your creativity (like I sometimes do, when I’m frustrated from working the design to support the goals and identity of others :smiling_face: :face_with_hand_over_mouth:)

Also, there’s a time in the process when it’s relevant to work on an aspect of design (or development). If there is already a ‘rebranding’ process/program taking place (is there?), working the color coding without having performed (or knowing of) the base of the new design is just a waste of time (your precious time :hourglass_flowing_sand:).

Finally, there’s this other thing: In terms of UI, one should never underestimate the power of ‘habits’. Users get used to a visual (a method, an approach)… to a point where after sometime, anything that disrupts this habit becomes a barrier and can bring frustration and other negativ feelings. It’s very hard to create a seamless revolution in UI (or gameplay). Even the biggest studios and the (pseudo) experts fail in doing this nine times out of ten. And for what potential benefit? I’m pretty sure that once you will have used the PG more often, you’re not even going to look at the icons anymore. After a while, it will become ‘instinctive’. You will know that the first button is play, the second is save and so on… You won’t even look or care about the icons anymore… because, that’s the way WE (simple humans) record the information. I’m pretty sure that if we were to invert the sequence, many people would start to express their unrest and disapproval. For this could only be done with a very good reason, coupled with a new user experience (with a 50/50% chance of success/failure).

Last but not least, sorry if we somehow ‘polluted’ :oil_drum:your post with our ‘thoughts’. But it’s basically what the Off topic category is here for. Not to pollute of course :grin:… but to let us just openly share (and eventually confront) ideas and opinions. For the good :innocent:, always for the good and the bright side of the force :crossed_swords: :smile: