#UX/UIDesign

[scipunk]

Blade Runner 2049 (2017)

[fruitiermetrostation]

HTC P6300 Panda

[niko4696]

[thisisrealy2kok]

Nintendo in 2001

[ordicat]

Saw this tweet on my feed earlier.

Although this is sensible advice, I thought I'd take it a step further. In order to understand UI/UX design rules, you need to learn to break them to use them. Therefore I give the following advice:

The weak dark mode users will run away in fear while the strong stay. This is natural selection at its peak and you cannot change my mind

[daveedmee]

hey font nerds

[ does anybody know any good fonts for a lil my "pc as a website" project? ]

pwetty pwease? >:3 # this is a threat

REQUIREMENTS: - Kinda like Android Material UI but more suited for a "modern" PC desktop [ I like Inter ExtraLight for example :3 ]

or: - something good for icons. tray, notifications, you get the gist [ - i know nerdfonts and i can guide myself through their patcher so combining them with a "sleek" main font should be no problem. Wanna get more into python stuff anyways. ]

[ but wait, there's more: - i'm getting cozy with a mono font on my current setup, so if there's any that give of a more like "coffee house vibes and today is cocoa day" vibe, they're also very much appreciated OwO # ^> again, a threat.]

[ oh and also: - access to adobe-fonts is not a problem, i have a adobe license from work # ^ sharing is caring 💚 ]

⬇️ ⬇️ ⬇️ OBLIGATORY CONTRACT INFO DOWN BELOW ⬇️ ⬇️ ⬇️

SERIOUS ENQUIRIES ONLY! (middle click)

[ oh and plz many thanks :3 # < this time i really mean it :3

💜

]

[pileojunk]

Some assorted class work from this week- I’m working on the UI for our game and the backgrounds have been coming out so GOOD AND TASTY I think I’m learning to love doing pixel art my dudes

[destined-productions]

I know it isn't not everyone enjoys making UI's, but I am really enjoying getting the flow right. The help even detects if controller or keyboard was used last. Everything feels fluid and responsive.

I am a solo dev from Australia turning children's physics toys into a game cause I couldn't find one to play, so trying to make one myself!

If you want to support me please wishlist on steam or visit the website to find out more mightymarbles.com

[izicodes]

You're so right abt all these websites looking freaking the same. Too polished, corporate typa style bs. And it's not only websites, it's applicable to books too. Everything looks bland and the same. I honestly miss early 2000s style. I don't care if it was tacky or anything. At least they were interesting and each one was unique in it's own brand of quirk lol

Hiya! 💗

I agree! I love different styles shown in websites! Everything nowadays are following this trendy of "spacey subtle but a lot few colours" and they say it's all for user experience so I wonder is it the users' fault or are the designers just following a trend they got from another designer and so forth and not really what the user wants? I mean, I bet now the users who view the websites are noticing, like we have, that oh the same style again. I don't know as I'm not a UX/UI designer so I can't judge entirely but from a user perspective I am tired of websites all looking the same, I mean even those old government websites look better than this gradient spacey look that's going on.

But just as they're a trend, they will die out soon. I remember when glassompishm was super duper trendy, when I started learning how to code websites around 2021-2022, it was everywhere and now it's not as popular, I see less of it now, so we'll see what's next 🤞🏾

On that, this is why I like neocites with it's diversity and uniqueness! Also check out mine hehe~!

[yokaizuna-sumo]

It took more work than I thought it would, but I polished up the game's UI and added some options. It even works with controller pretty well now!

[antisepticz]

meu primeiro redesign!

[ br / eng ]

[meu primeiro redesign e como isso é mto confuso/my first redesign and how this is so confusing] lição mágica aprendida hoje: paciência.

˚✧ antiseptic ݁ ੭

BR :

’ㅤㅤㅤok é estranho postar depois de algum tempo MAS EU JURO QUE TENHO FEITO COISAS!

primeiramente, percebi que eu não ia conseguir aplicar meus estudos se eu não colocasse em prática (obviamente?), então do q adiantaria estudar se eu não faria nada com isso?

eu estava navegando na minha maravilhosa shein com esse pensamento, quando eu parei pra analisar: POR QUE EU NÃO FAÇO UM REDESIGN DA SHEIN?

sim. eu fiz.

Este site é propriedade da Shein e é destinado exclusivamente para fins de estudo. Todos os direitos sobre os materiais, informações e elementos gráficos apresentados neste site pertencem à Shein e estão protegidos pelas leis de direitos autorais.

ok pra começar: eu não fazia ideia do que fazer. não pensei em nenhuma teoria ou nada, eu só simplesmente fiz???

acredito que esse post vai ser o mais curto do perfil, mas irei tentar explicar meus processos pra não ficar tão sem conteudo. ao final do post, terá o link do resultado caso queira pular!

TIPOGRAFIA:

a escolha da fonte foi uma abordagem que precisava ser elegante e moderna, sabia que essa fonte foi criada sob encomenda do 6616 studio para um projeto do governo provincial de jacarta chamado ‘+Jakarta City of Collaboration’, lançado em 2020. ela se inspira em fontes como Neuzeit Grotesk, Futura e outras sans-serifs grotescas dos anos 1930, apresentando um contraste quase monolinear e curvas agudas.

a plus jakarta sans é caracterizada por suas formas modernas e limpas. ela tem uma altura-x ligeiramente maior, o que proporciona um espaço claro entre as letras maiúsculas e a altura-x. além disso, a fonte é equipada com contadores abertos e espaços equilibrados, garantindo uma boa legibilidade em uma ampla gama de tamanhos.

agora que te dei um contexto histórico dessa fonte, vou te explicar algumas razões que me fez escolher ela (não, não foi aleatorio ok). a fonte reflete uma estetica moderna e contemporânea, proporcionando espaços claros e legibilidade em vários tamanhos, tornando uma escolha versátil para diferentes elementos, desde títulos até textos menores.

CORES:

confesso que nessa parte não tenho muito a dizer, o preto é uma cor elegante e básica, tornando a comum. em termos técnicos, o preto é a ausência de luz ou cor. no espectro de luz visível, a cor preta absorve todas as cores e não reflete nenhuma delas para os olhos. legal, ne?

sobre o vermelho, é obvio que eu precisava de algo chamativo; o verde normalmente simboliza elementos da natureza, mas em alguns contextos ele também representa renovação, então, imaginei que essa era a melhor cor pra representar sobre avisos de roupas ou quaisquer coisas novas.

agora o roxo, não sei dizer o que me levou a escolher essa cor, confesso que entrei no site da SHEIN e dei uma boa olhada no motivo de ela estar ali e tudo o que me faz pensar, sinceramente, é porque ela é chamativa, o que faz o usuario ficar ansioso e pensar nossa meu deus TENDENCIA eu preciso comprar!!

CONCLUSÃO

esse foi meu primeiro trabalho concluído, de fato. tanto como webdesign como redesign, eu realmente gostei muito de ter feito e me diverti ao longo do processo, mas eu ficava ansiosa pra terminar e percebi que eu tentava atropelar algumas etapas, isso deve ser mais comum do que eu imagino e eu preciso treinar isso, mas tirando isso.... consegui trabalhar bem olhando as referencias do proprio site da SHEIN e acredito que fiz um retrabalho bom!

POR FAVOR SHEIN ME CONTRATA

dúvidas, sugestões ou críticas? me mande um ask, ele está aberto para qualquer tipo de coisa que tenha surgido durante o post. ♥︎

ah, e sobre o resultado final, claro....... eu postei no dribbble! provavelmente vai ser a plataforma que utilizarei em todos os meus posts para mostrar o design final, ent caso vc n queira ver meu monologo, basta pular direto pro final!

https://dribbble.com/shots/24251593-SHEIN-Redesign?added_first_shot=true

[meu primeiro redesign e como isso é mto confuso/my first redesign and how this is so confusing] magic lesson learned today: patience.

˚✧ antiseptic ݁ ੭

ENG :

’ㅤㅤㅤok it’s weird to post after some time BUT I SWEAR I HAVE BEEN DOING THINGS!

firstly, I realized that I wouldn’t be able to apply my studies if I didn’t put them into practice (obviously?), so what would be the point of studying if I wasn’t going to do anything with it?

I was browsing my wonderful shein with this thought, when I stopped to analyze: WHY DON’T I DO A REDESIGN OF SHEIN?

yes. I did.

This site is owned by Shein and is intended exclusively for study purposes. All rights to the materials, information and graphic elements presented on this site belong to Shein and are protected by copyright laws.

ok to start: I had no idea what to do. I didn’t think of any theory or anything, I just simply did???

I believe this post will be the shortest on the profile, but I will try to explain my processes so as not to be so without content. at the end of the post, there will be the link to the result in case you want to skip!

TYPOGRAPHY:

the choice of font was an approach that needed to be elegant and modern, I knew that this font was custom made by 6616 studio for a project of the provincial government of Jakarta called ‘+Jakarta City of Collaboration’, launched in 2020. it is inspired by fonts like Neuzeit Grotesk, Futura and other grotesque sans-serifs from the 1930s, featuring an almost monolinear contrast and sharp curves.

the plus jakarta sans is characterized by its modern and clean shapes. it has a slightly larger x-height, which provides a clear space between the uppercase letters and the x-height. in addition, the font is equipped with open counters and balanced spaces, ensuring good readability in a wide range of sizes.

now that I’ve given you a historical context of this font, I’ll explain some reasons that made me choose it (no, it wasn’t random ok). the font reflects a modern and contemporary aesthetic, providing clear spaces and readability in various sizes, making it a versatile choice for different elements, from titles to smaller texts.

COLORS:

I confess that in this part I don’t have much to say, black is an elegant and basic color, making it common. in technical terms, black is the absence of light or color. in the visible light spectrum, the color black absorbs all colors and does not reflect any of them to the eyes. cool, right?

about red, it’s obvious that I needed something eye-catching; green usually symbolizes elements of nature, but in some contexts it also represents renewal, so, I imagined that this was the best color to represent about clothes warnings or any new things.

now the purple, I can’t say what led me to choose this color, I confess that I entered the SHEIN website and took a good look at why it was there and all it makes me think, honestly, is because it is eye-catching, which makes the user get anxious and think oh my god TREND I need to buy!!

CONCLUSION

this was my first completed work, in fact. both as webdesign and redesign, I really enjoyed doing it and had fun throughout the process, but I was anxious to finish and I realized that I tried to rush some stages, this must be more common than I imagine and I need to train this, but apart from that… I managed to work well looking at the references from the SHEIN website itself and I believe I did a good rework!

PLEASE SHEIN HIRE ME

questions, suggestions or criticisms? send me an ask, it is open for any kind of thing that may have arisen during the post. ♥︎

ah, and about the final result, of course… I posted it on dribbble! it will probably be the platform that I will use in all my posts to show the final design, so if you don’t want to see my monologue, just skip straight to the end!

https://dribbble.com/shots/24251593-SHEIN-Redesign?added_first_shot=true

[scipunk]

The Fifth Element (1997)

[fruitiermetrostation]

Nokia 6680 (2005)

[design-studio-ui-ux]

Shadows are a powerful tool in UI design! 🌟 They add depth, guide user attention, and make interfaces feel interactive. Whether you're using soft shadows for buttons or strong shadows for modals, it's all about creating a seamless user experience. 🙌 ✨

Pro tip: Ditch black shadows and opt for color-matched ones for a polished, cohesive look! Want to know how dynamic shadows can elevate your design? Check out these essential tips.

[thisisrealy2kok]

[krimsonkatt]

Chronicles Meteorfall UI

The finished version of Chronicles Meteorfall's battle UI! Looking great! And if you were wondering, yes, the UI was inspired by Shin Megami Tensei V, of course with my own custom touches added on top. Most of the numbers and names are placeholders and will be filled in with the correct information in the actual game.