"Behind the Interface: UI-UX Design" [ENG-ESP]
Greetings Hive Geek tech lovers, welcome to my post once again I'm Nitsu and it's been quite a while since I've shared with you the things I do in my work so without further ado I begin.
Saludos amantes de la tecnología de Hive Geek, bienvenidos a mi post una vez más soy Nitsu y hace bastante tiempo no comparto con ustedes las cosas que realizo en mi trabajo así que sin más vueltas comienzo.
Currently I work as an interface designer or better known as UI-UX design, in a few months it will be two years since I started to get into this world and I have noticed the evolution in the projects I have been doing. Partly when they hired me they saw the opportunity that I, not having previous knowledge and being conditioned to a format, I could generate new proposals and indeed I succeeded.
(Here I will leave some examples of old screens designed by my colleagues).
Actualmente trabajo como diseñador de interfaces o más conocido como diseño IU-UX, dentro de algunos meses se cumple dos años desde que comencé a adentrarme en este mundo y he notado la evolución en los proyectos que fui realizando. En parte cuando me contrataron vieron esa oportunidad de que yo, al no tener conocimientos previos y estar condicionado a un formato, podría generar propuestas nuevas y efectivamente lo logre.(Por aquí voy a dejar unos ejemplos de pantallas viejas que diseñaban mis compañeros)
In the images I share you will see zoned plans, this was one of the first works I started from scratch. My boss received a request from INMET (National Institute of Tropical Medicine) located in Misiones, there began the construction of the work and we had the task of generating the ventilation system, air, among other things and through an interface (the one you see in the images) could verify the temperatures of the different areas of the complex.
Ustedes en las imágenes que comparto estarán viendo planos zonificados, esta fue una de las primeras obras que empecé de cero. A mi jefe le llego un pedido del INMET (Instituto Nacional de Medicina Tropical) ubicado en misiones, allá se comenzó la construcción de la obra y nosotros teníamos la tarea de generar el sistema de ventilación, aire, entre otras cosas y por medio de una interfaz (La que ven en las imágenes) se podrían verificar las temperaturas de las diferentes áreas del complejo.
To make these axonometric views to me I get the plan of the facilities in AUTOCAD format, from there I must identify the information I need and then modeled in 3D all floors that may eventually need, once I have them, using a color table I start to zonificarlos spaces where air conditioning equipment work. For example, in the red area works the AHU 05, in the green area the AHU 06 and so on respectively. The UTAS perform the same function as an air conditioner only they are much larger because they have to cool large volumes and operate continuously.
Para realizar estas vistas axonométricas a mi me llega el plano de las instalaciones en formato AUTOCAD, de ahí debo identificar la información que necesito y posteriormente modelar en 3D todos los pisos que pueda llegar a necesitar, una vez los tengo, utilizando una tabla de colores empiezo a zonificarlos espacios donde trabajan los equipos de aire acondicionado. Por ejemplo, en el área roja trabaja la UTA 05, en la verde la UTA 06 y así respectivamente. Las UTAS cumplen la misma funciona que un aire acondicionado solo que son muchísimos más grandes porque tienen que enfriar grandes volúmenes y funcionar continuamente.
|
|
|---|
So in Photoshop using the stroke tool, I was selecting the rooms, painting them in their corresponding color and generating layers to make everything more orderly. This way I can find each space in case I need to make any modification later.
Así que en Photoshop usando la herramienta trazo, iba seleccionando las salas, pintándolas de su color correspondiente y generando capas para que todo sea más ordenado. De esta forma puedo encontrar cada espacio por si posteriormente necesito hacer alguna modificación.
Once I had all the plan ready I had to somehow identify that area with its respective temperature so by means of some buttons or balloons I created lines so that it could be understood and there is a quick reading for the operator. The final results can be seen in the following images.
Una vez tuve todo el plano listo debía identificar de alguna manera esa zona con su respectiva temperatura así que por medio de unos botones o globos fui creando líneas para que se pudiera entender y haya una lectura rápida para el operador. Los resultados finales los podrán ver en las siguientes imágenes.
 |
|
|
|---|
There is a lot more work behind all this since the software part must be joined with the hardware. My colleagues went there to place the equipment, sensors, pull cables while I was in charge of the graphic section and other colleagues generated the programming to unite all this. We are a small team of 11 people who carry out these large projects and it takes quite a long time because many times errors arise or the people who hire us ask for modifications or extensions in the projects.
Hay mucho más de trabajo atrás de todo esto ya que la parte del software se debe unir con el Hardware. Mis compañeros fueron allá a colocar los equipos, sensores, tirar cables mientras yo me encargaba del apartado grafico y otros compañeros generaban la programación para unir todo esto. Somos un equipo pequeño de 11 personas que realizamos estos grandes proyectos y tardamos bastante tiempo ya que muchas veces surgen errores o las propias personas que nos contratan piden modificaciones o ampliaciones en los proyectos.
What did you think of this post? I hope to be able to share here more often the work I am doing, some I can't bring them because it is sensitive information from our clients and others I simply forget to document them to publish them. I hope you have a good week and I wish you all the best of luck.
¿Qué les ha parecido este posteo? Espero poder compartir por aquí con mayor frecuencia los trabajos que voy haciendo, algunos no puedo traerlos porque es información sensible de nuestros clientes y otros simplemente me olvido de documentarlos para publicarlos. Espero que tengan una buena semana y les deseo mucha suerte.
My 3D printing works @nit_3dprinting
Mis trabajos de impresión 3D @nit_3dprinting
Translated by DeepL
Traducido con DeepL
All images are my own
Todas las imágenes son de mi autoría
My last post "Replacing Imports with Creativity" [ENG-ESP]
Mi último post "Replacing Imports with Creativity" [ENG-ESP]
0
0
0.000
Interesting! I was wondering if you are responsible for the programming part of the UI design as well? Nice to see how this sort of work is being done, thanks for sharing!
Ohh!!! amigazo ¿Como va? Antes que nada gracias por pasarte. A veces tambien me encargo de hacer la programación, generalmente hago la programación más sencilla usando bloques ya armados porque realmente no es mi fuerte ni mi área de trabajo.
Here comes my favorite magician, Nitsu 😁
You should post about your work more often, by the way.
La verdad es que tenes razón, el problema es que me olvido de sacar capturas del proceso jajaja y siempre me termino acordando cuando ya tengo todo terminado y prolijo. Muchas gracias por pasarte @erikah siempre se aprecian tus comentarios
Es bastante interesante el tema, no sabía que era de esta forma en que se hace este trabajo.
Ahora tengo una idea un poco más clara.
Este tipo de interfaz esta pensado para operadores de edificios grandes. Por ejemplo en el sexto piso de un edificio, en determinada aula le piden a este operador que para cierta hora de la semana la sala 501 este a 24° entre determinado margen de horario, lo que puede hacer esta persona es configurarlo en el sistema para que automáticamente ese día a ese horario la sala este a la temperatura deseada lo que hace que ahorres tiempo, personal y energía electrica.