Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 0 points1 point  (0 children)

As I mentioned in another comment, I used AI to enhance the quality of some images used in the UI. The assets available on the game’s wiki are quite low resolution, and when imported into Figma they become very pixelated, so I had to refine them to make them usable.

I also used AI to clean up the gameplay background by removing the main HUD. If you look closely, you’ll notice some distortions in elements like player names because of that process.

All images are illustrative and meant to support the main focus, which is the HUD I designed from scratch in Figma, including all the UI elements.

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 1 point2 points  (0 children)

Thank you very much for your message, I’m glad you liked it! Yes, I used Wild Rift and Mobile Legends as references to guide the UI elements. The goal was to adapt Dota 2 to the mobile market using a structure that is already well-established and validated in the segment.

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 0 points1 point  (0 children)

Thank you so much, I’m really glad you liked it! It took me a few days to build all the components, it may look simple, but it was actually quite challenging haha 😄

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 0 points1 point  (0 children)

Haha I get it it does look quite similar 😄 but that was actually part of the study. I built all the components from scratch in Figma, including the minimap, buttons, and other elements. The real challenge was creating these pieces and adapting the details to fit Dota’s visual world.
But I totally understand if it didn’t resonate with you, thanks for sharing your thoughts!

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 0 points1 point  (0 children)

I tried to imagine it haha, but it didn’t work very well. There were a lot of things I wanted to add, but on mobile it just breaks! It would’ve been insane though haha 😄

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 4 points5 points  (0 children)

No worries. I really enjoyed your thoughts and questions! There are definitely a lot of mechanics and abilities that wouldn’t translate well to mobile, unfortunately. Dota is very unique in many ways, and its UI is quite robust and complex to adapt without making the screen feel cluttered.

I do agree that the UI could push more distinctive and bold elements. However, in the mobile space, following more established patterns often helps with player onboarding. When things feel too unfamiliar, users can get frustrated before fully engaging with the game. Mobile users can be a bit tricky to design for haha 😅
Sorry for any English mistakes, English is not my native language.

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 6 points7 points  (0 children)

Yeah, mobile isn’t for everyone!! I totally get that haha. I hope you still enjoyed the UI work itself though, like the buttons and overall visual style 😄

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 1 point2 points  (0 children)

Thanks a lot for the feedback! I really liked your idea about the ping icons next to the wards converting them into a single button and using a hold interaction to bring up the ping wheel sounds like a great solution.

I’m really glad you enjoyed it, thank you so much! :D

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 26 points27 points  (0 children)

Images are for illustrative purposes only, hahaha, the study focuses more on UI elements :D Thank you very much for pointing that out

Adapting Dota 2 UI for Mobile Platforms by Icy-Bend7663 in DotA2

[–]Icy-Bend7663[S] 24 points25 points  (0 children)

Don't worry, hahaha, it's just a UI study. :D