CarGO: com es dissenya una navegació per a cotxes elèctrics

Imagínense que yo les doy este mapa de navegación y tienen que hacer su propia UI como lo harían, de seguro tienen que traer el usuario hace donde va y también a la velocidad en la que está haciendo. Una barra en navegación del lado, pero también una barra con información sobre el viaje. Aparte de eso el viaje dice que por cancelar eso sin duda y ya que estamos en viaje está uno de las alertas en el mapa. Aparte de las alertas también tenemos que tener como mutiarlas y a su vez ya que estamos mejoremos como se ve la navegación. Así fue como se formó cargo y en este video vamos a hablar todo sobre eso. Bueno cuando hablen carro la primera vez, lo que aparece es esto, la pantalla de inicio de sesión voy a elegir un mail esto lo que hablen real igual porque tengo algunos mail privados acá, luego de que carga lo que aparece es esto, esto es la pantalla bienvenida a Lomborgue, como se le dice, todo aplicación lo debe tener porque lo que hace es para el usuario que no tiene mucha idea de qué es la aplicación que apó que la abajo para probar lo que sea, como pueden ver como resumen, cargo reúne cargador, disponibilidad de a planecés años, la verdad en la gente no lo voy a ir a sigir, otros detalles más abajo y yo lo que dice como pueden ver como en el tema de Branden, el video anterior, usted el logo con la macotita haciendo distintas actividades correspondientes a lo que está diciendo la aplicación obviamente. Le damos continuo a ya que hayas tenemos para el hígito en el modelo de auto, como el dije anteriormente en otro video, tenemos todas las marca actions de Norueva y con los modelos y los yos y a la legislación de noveder. Le damos continuo a ya que hayas hasta un lado el aparte de explorar mapa. Y como pueden ver, eso que tiene arriba, la alerta de la colización que yo dice para los usuarios cuando hay una colección de OTAR, se recuerda que es un video anterior, que hay un botón que lo suele la preta, la renicia la aplicación y la aplicación, la aplicación alta, bueno, básicamente es esa notificación de ahí, como pueden ver es clara, esta agarriva reinchar carro se apreta y se reinicio tomáticamente con la actualización hecha. Acá estamos en el UI, después de lo Mordin como le dije, no lleva al mapa, el mapa básicamente es como un mapa de navegación, luego que he ditado, digamos,

se ha transformado a lo que a las necesidades de cargo, la necesidad de cargo o cuelzón, la depoder buscar un cargado, la depoder fitra carra ores, la depoder, vea los carrares en el mapa, obviamente, si más vuelta vamos de arriba para abajo, como Voy a poner un detalle muy importante que yo agregue, si comenzamos bien desde arriba, es que el mapa tiene como ese degradir blanco que viene de 100% de banco hasta 0% Eso no viene con el mapa, esto lo agregue yo, porque el problema que tenía en Android era que los datos del mapa se me mezclaban con la barra superior de Android La barra superior que dice la batería, la hora de más Lo mismo también pasaba en horizontal, como pueden ver que acá tenemos horizontal, metá un poquito pero para mostrarles Entonces lo que tuve que hace yo básicamente fue eso, fue como se digra de para tener ese contraste Después ya lo que tenemos más abajo es la barra de Ucera de toda la vida para buscar lo que ha sido a las barras de Ucera, primero por la calidad, después de Ucera por nombre de calle, después de Ucera por cargador, porque eso a su miques muy raro que hay un cargador de memoria y si se lo sabe en la imoria de Ucera y te va a aparecer. Después tengo a los filtros que son los filtros de toda la vida que están bajo mi punto lista donde tienen que estar al lado de la barra de Ucera. Después tenemos el objeto que este objeto, primero que nada como pueden ver, no tiene el tamaño ideal, no tiene el mismo tamaño que el filtro porque real ya es si ojo su lo pienso ver de ahí, por eso no lo he tocado, porque lo tengo que lo quiero mover de lugar y bueno eso lo veremos adelante. El ojo lo que hace es básicamente ocultar o mostrar las cámaras de la vuelta, los peligros o los pedajes. Básicamente las cámaras que la vuelta son como poner esta cabeza de 45 km por hora, que os sea más afuero, es su estilo de activamos y no va a aparecer más. Básicamente para la gente que quiere tener el mapa un poco más limpio cuando busca carradores. Después tenemos la parte abajo, la barra de navegación que tenemos el icono de ubicación para ir a la ubicación, para centrar la ubicación, el menú para las peztañas que ahora voy a mostrar para el encutamiento, para el Partil y Settings. Después tenemos acá la lista de caravores más cercanos, lo caravé más cerca, que he dicho ese apaso,

esta lista se ha goqué está desde el inicio de cargo. Literalmente, una de las primeras cosas que se programó, ese salista y ha sobrevido, he pensado sacada, pero hay gente que me ha dicho que la usa, entonces, la quise dejar. Después tenemos el bucador ahí, el pop-up, que te dice los caravores en la vuelta, en un rango de unos 20 kilómetros más o menos. Y después tenemos el velocímetro, como pueden mover ahí, que el velocímetro aparece solo cuando se mueve el usuario, como pueden ver si yo me pongo a buscar desaparece y si yo lo vejo qué después que ven de hacer como un modo de navegación libre en la aplicación y tienen cuenta como que vos te hojas empezamos a mover ya te mostraré los 100 metros. Después lo que tenemos también son ahora lo que voy a hacer es un viaje hacia un cargado cualquiera para mostrarle lo que es ya el menú de navegación. Primero tenemos acá como pueden ver una previu de la ruta que tenemos la alerta de la ruta, así que hay alguna de mi mojo para ver o no las cámaras y después tenemos bueno como para comenzar el viaje o el acá donde se activa pero en realidad es la opción de guardar el viaje para hacerlo más tarde que el usuario lo pueden hacer. Le vamos a ir ahora y ya está volvíamos navegando. Tenemos como siempre la línea azul a seguir y un detalle muy importante que yo le agregue en el mapa es que te muestra donde venen que hablar muy al estilo Waze que a mí me gusta mucho ese detalle y bueno se lo quisa agregar y la verdad que quedó bastante bueno. En aggración tenemos arriba las direcciones obviamente con el viaje y curso con información del viaje el kilómetro aje y el tiempo esta o sea el tiempo estimado de arriba y después que acá tenemos un botón de muteo que mutea todas las indicaciones, no te ha solo las indicaciones, o un mutear las camas de los peligros. Yo por lo que general uso, mutear indicaciones y que solo me diga las cámaras de los peligros. Después tenemos un botón rojo claro para terminar el viaje, seguir navegando o guardado por amastabe en caso que se has probo, eso fue un detalle clave que quería que tuviera primera mano y que es super visible, cosa que sea en que el viaje enseguía el idea y abajo tenemos la barra de esta que lo que suele digo que la barra de esta básicamente es

es, es fichad acá, te muestra los carraores extra en la vuelta, si lo destructivas no te muestra ninguno, tomé esta sola el caro que está lleno, esta que es Time of Rive, en creo que es en inglés, o sea el tiempo estimado de arriba, seis minutos y acá tenemos a donde estamos llendo, digamos que te da un resumen de caro, la que te están dirigiendo básicamente. Y después tal, la barra como le dije anteriormente. Cancelamos el viaje, bueno, eso es lo que os considera lo que es UX, más que nada, porque Ui, bueno, es un Ui bastante básico. Es más siendo lo que es Ui UX, o sea una mezcla más de los dos. Tenemos por ejemplo el planificador de Ruta que tenemos claro de dónde salimos acá, por ejemplo, podemos cambiar si queremos de otro lugar, digamos que no sé que estás en cero ciudad y te vas para otra y querer salir desde esa ciudad, bueno pues, pues, por lo acá, ponemos a donde vamos y yo a calo que hice algo muy importante a nivel de UX, de experiencia en suario, antes cargo, el prenaficarlo de viaje funcionaba así como lo ven acá, o sea, ustedes manualmente el usuario malo no es un mente tenía que ingresar, primero la batería que con un esla de acá bastante lindo como pueden ver, la batería con la que salen y después tenía que poner la potencia mínima a la que quería cargar en cada parada, la reserva mínima de batería, cargar hasta tanto por ciento y la velocidad más o menos de ruta. ¿Qué pasa que hay usuarios? No avanzados que esto capaz que no lo entienden o no saben bien que poner. Entonces yo por eso al nivel de UX decidía agregar lo que es el modo tomático que cargo decide dependiendo del viaje de la auto de las cuestiones de climáticas de la ruta, que va a ser lo mejor. La velocidad de este era, por lo general lo que hace lo que hay cula, bajo los límites de velocidad de la ruta. Se se límite la ruta, siento que no me te aporaba, te va a colgular como que va a ir a 110. Hay leas que haycula ruta y bueno después que carregun poquito ya te da los viajes, por lo que ya te da tres opciones de rutas con las paradas y bueno ahí te da toda la información del viaje, inclusive te lo hace para por dia,

si es un viaje muy largo, te lo hace para por dia, aste, y sé, donde deberías carrar de noche y demás y bueno si vamos a hacer tal y seguir acá ya tenemos el previu de la ruta que inclusive se aprétan en cada uno y les vas a decir para planificar cuánto de cargas, cuánto llegas, cuánto de las que salir la hora que estaba bastante completo bastante lindo me gustan, estoy muy feliz con como quedó esto y bueno eso es el planificador de rutas pues vamos a la parte de perfil, carrega cuando yo hice la aplicación no te dejaba poner nombre ni está fotito de perfil como hay acá. Le habrá que no quise poner fotos de perfil, justo amizable que le usual lo posto de poesos porque te pueden subir cualquier cosa y bueno, por temas de que van en la aplicación, lo que sea, bueno, decidí usar a batars que lo dice yo, después de la que garmas igual. Y el nombre público que está bueno porque para las reseñas nos reportes de más, obviamente, casi no iba a querer que se ve a su yme, entonces decidí agregar un nombre público. Y bueno, pues tenemos la opción, pero acá podemos activar cargo, si queremos para posar la aplicación. Después acá tengo una parte muy importante que es a parte de mi autoeléctico. que al calo que hace es elegir la marca de auto que usas. Como pueden ver esta separado por marca, con su logo y después está separado por auto con su foto real de la auto y con la mejor información que le puede abar de la auto. Y acá después tenemos cuando seleccionamos el auto y una parte de auto no me da real como dije anteriormente hay usuarios avanzados que ya saben lo que gasta su auto o lo que les da su auto.

Entonces, si ingresa listo acá, cargo lo que hace es tener en cuenta lo que lo suero grego y tener en cuenta lo que los datos de la auto de LTP, mas que nada utiliza y también los datos que cargo guarda de los autos mismos y a los usuarios. Y después acá tenemos una partado de pedir ayuda a que esto mas que nada es, digamos que no sé, te quedas en la gulada o no tenemos donde cargar, tener ese grupo de fero de autos elécticos Uruguay o el telera de autos eléctric Uruguay, y ahí bueno, para que el usuario entra y pida ayuda a un cargador en la gulada o un cable o lo que sea, su que era algo que tenía que estar el aire o en ese salio bajo un mismo punto de vista. Y bueno, después acá tenemos esto no se va a la historia de la leveja, es que el historiario que como dije es algo para los usuarios, pero te guarda la cantidad de bígica y si te los kilómetros tiempo de carga y demás. Y después vamos a algo que es settings que se tiene la verdad no tiene mucho, tenemos el idioma español o português que cambia automáticamente tema oscuro, claro, super necesario, obviamente para una aplicación en la negación más que la para la noche. Cambiar de país a lo que es Brasil Argentina Uruguay activar pronudamente y bueno, que tenemos para eliminar la cuenta. Un UX bastante básico la verdad, no es nada de otro mundo como pueden ver, bueno, no creo que si me ha hecho un muy largo el video así que ahora vamos a ir al Anthony del pasado que grabo la navegación hoy temprano cuando tuve que salir así que vamos con ese video bueno acá estamos voy a tratar de hacerlo posible para poder filmar el tema de lo que es el UI en movimiento así que hemos sido esto que lo que vamos a hacer es cerular como pueden ver así se ve en lo que es horizontal ahora en un rato lo voy a ahora lo pongo vertical del muestro ahí tenemos lo que es la velocidad tan aviración y demás como les decía en el El video la fechita 3D todavía no está implementada esta versión producción la que estoy usando no está implementada pero bueno pues en mi era ahí tenemos un caráver a la izquierda se puede ver que es un caráver privado que lo van a ver a si lo sé si lo van a ver el estacionamiento ahí, ese es el caráver chiquito naranja básicamente hay mucha

mucho más como se ve la versión vertical que la horizontal pero ahora vamos a girarlo quedaría así se ajusta automáticamente hacia la derecha de la pantalla lo que es la ubicación y bueno todo el UI pasaría a la izquierda, todo lo que es lo que el usuario tiene que tocar, porque la idea a mi aera es que el usuario con el opónio horizontal, obviamente va a tener su teléfono apuntando hacia sí mismo, entonces al tener su teléfono apuntando hacia sí mismo es más fácil tocar los botones, por ejemplo le vamos a mostrar ahora, yo voy así y si quiero múltiara, abre acá y ahí múltiho, como ahí ahí tenemos la alerta de la cámara y tenemos la velocidad ahí, me dice el máximo 60, bueno como podemos ver lo tapar la isla, así que voy a tener que tranquilo con eso, el tema de la ila de life o los atappingos, capaz de un poco de un poquito de veloz y metrú un poco más abajo, y tenemos también el juego que empezamos por la cámara, tenemos ese aviso ahí de eso mismo, que se pasó por la cámara. Veve los címetros funcionan bastante bien, obviamente todos están en pureba, yo lo que vi, que el veloz metro vez y tiene como algunos altitos de velocidad, meyes extraños y obviamente poco naturales, que eso ya lo voy a hablar, me pasaba a lo mismo también con el tema de la flecha, la aflucha 3D a veces como que pegaba jivos, así, antinaturales y bueno, bueno que eso es hacer cosas antinaturales, va a llegar a la unancia, es fácil arregarlo con código porque es simplemente limitar esos movimientos tan bruxcos y la verdad que quedaba bastante bien, pero bueno como pueden ver, la negación es bastante smooth, la ubicación se mueve suave, continúa, el mapa le ha sido perfectamente, después como le dije, el tema del mapa es Mapbox, pero todo lo que ver, acostumizado por mí. Como vean, tenemos una sola colar que me está avisando. Todo lo que vean es, acostumizado por mí. Por ejemplo, dejen que me hace el muestro ahí, el escúdito de la ruta con el nombre de la ruta, eso lo hice. Yo el ícono de la cámara con la velocidad arriba, todo, acostumizado y bueno. Y exclusive, yo agrega algo, porque si vos te van andando y mueve en el mapa, como pues me la parece un cartelito ahí, que dice, no manipule cargo mientras conduces y si déjan el mapa quieto como pueden ver vuelve automáticos a la ubicación en realidad esto es algo que va a quedar acá entre nosotros en el video yo hice que cuando el usuario van navegando cuando el usuario se va moviendo por temas de seguridad que el mapa no sea tan manipulable o sea es como medio molesto manipulado pero este es el estado de gusto en realidad tendría que ver porque por ejemplo si el usuario va con un copiloto en copiloto de

día por manipular el mapa para buscar por ejemplo un carrador en la vuelta lo que sea Yo soy el que estoy viendo, lo estoy deliberando todavía, bueno, no sé bien cómo hacerlo. Pero bueno, básicamente, así funciona cargo en mi entrese navega. Ahora yo voy a poner un destino y les voy a mostrar ya con destino. Así que voy a cortar el video acá, un segundo disco, pongo el... voy a frenar obviamente. Pongo el destino y ya vuelvo con ustedes. Bueno, como puedo ver ahí, ya me calcula la ruta, vamos a poner ir a hora. Y ahí ya comenzó la navegación, vamos a mirar... porque viene en autos atrás, hay que poner la línea azul, lo podemos realizar si queríamos y ver la acción de tenemos que ir. Bueno, ahora sí comenzamos lo que es el viaje y lo de demostrar. Másicamente, prácticamente lo mismo, pero como pueden ver ahí, tiene lo que son las indicaciones, al arriba, bien clara, yo quería decir que se veía, tiene el botón de multidad, las notificaciones y el botón de terminal de viaje. Después está tenemos la velocidad y acá tenemos la barraeta, le digo yo que es para el tiempo activado de ese te llegada, pero también tiene el switcher para los carregores extra y tiene el lugar en el ciudad donde vamos, digamos la parada. Y bueno básicamente, así funciona lo que es una averacción, así como digo un UI que yo lo que se hace era accesible, lo que se hace es fácil de manera, pero ahora porque voy grabando, y obviamente es mal difícil, pues si sufueras solo manejando es simplemente con un dedo, ir tocando y tienen todo ahí. Por ejemplo acá lo de esta rarviaje como pueden ver y es lo que yo decía en el video anterior de cargo que es como más accesible ahí tranquilamente lo pueden hacer y como pueden ver las notificaciones también que es como más accesible para multidad a lo que sea. Así que bueno, voy a terminar esta parte de acá, contriamos en mi casa. Bueno, ya volviendo a lo que es acá al después que le mostré en la relación hay unos unos puntos que le voy a tener en cuenta. Por ejemplo, una cosa que yo mencioné en el video original, ¿qué pasa cuando os tenes tantos cargadores en un país? Urbén dentro de todo no tiene tantos pero así por ejemplo es una locura Lo que pasa es que uno tiene que debo manejar todo esta cantidad de carregores. Lo que yo hice como pueden ver es un sistema de agrupación.

De lo vas agrupando por la ubicación, a mí ya que tú te vas a dejar de llamar, a que tú te vas a sacando, te vas distribuyendo como tiene que decidir. Por ejemplo yo soy cacandurano, van a ver siete carregores. Otra cosa muy importante de en cuenta es este botón que yo puse para cuando se abre la aplicación es un botón de ir al carregor más cercano. Te marca el carregor. Dependiendo de ubicación el carregor más cercano y te hace automáticamente la ruta hacia él. Esto más que nada es para el uso de lo que está purado, que tiene que ir a cargar si o si, pues, o por una emergencia, o por eso, porque es realmente el para el único que te usí al autoes para ir a cargar. Entonces, le hayas de esas que te subas y que ya estés navegando hacia el cargo más cercano. Y bueno, después tenemos esta lógica como pueden ver de agrupación y desagrupación como le digo yo, que básicamente lo que haces agrupar los caradores por sector para que no haya mucho ruido en el mapa, porque imagines, por ejemplo, si yo hago así, te haría todos cargados uno encima de otro y la verdad que es una locura y dicho sea, a paso, esta lógica a mí en lo que es brasil me sirio muchísimo, porque ahora sí tiene miles de cargadores y bueno fue la mejor forma que hubo de manejarlo. Después tengo la versión horizontal que debemos traer a mí mismo me voy a tapar la cara a ver si me logró mover la cara para notar para meter a cara va a quedar la pantalla en el grave y bueno no pasa nada. La versión horizontal lo que tiene es que claramente yo le trabajé mucho, pues primero que nada yo cuando no me habío en el auto, a mí me gusta que este horizontal yo no uso el celular recto y yo quería que fuera lo mejor posible como expliquen en la parte de navegación, lo quería que sea accesible para que si el usuario tiene que tocarla pantalla o lo que sea que le es que sea accesible, va a la redundancia, o sea que si el usuario quiere navegar un carador poner el carador, poner con cargo y ni se al viaje como pueden ver esta cala izquierda si no ponemos en la visión de un conductor que tiene el celular acá esto carai es un botón grande y como pueden ver tenemos todos los botones en lo que es acá a la izquierda que yo puedo tranquilamente agarrar, cancelar el viaje sin esicito,

muti a las alertas, se ha puesto muti a la alerta, él un moque le mostré en la parte navegando muti a las alertas, cancelar el viaje y bueno básicamente todo lo que necesitan mientras conducen Yo le habrá que estoy muy hústoso de lo que es el sistema horizontal, aparte como pueden ver la ubicación se centra automáticamente, como pueden ver si lo pongas así, se va para el centro, se ve un poco más abajo, pero bueno, disculpe en que no lo puedo como arrar. Y se lo va así, se va para la izquierda y así queda ya se ha navegando o ya se ha sin navegar. También lo mismo porque cargos tiene una averación libre, como el dioso, que básicamente es una averación libre, que tú te vas moviendo, el mapa donde estés, te vamos a estar onocar agador, te vamos a estar onocando libertas, pero es como que estoy enamorizando que como su luz la masión el partel tiempo, pues yo ya en mis vidas, ya se como verme y tan no necesito estar marcando, de una vida donde no. Y bueno básicamente creo que cubritó espero no haberme lo olvidado de nada. El idea como les digo es bueno, la idea siempre fue la accesibilidad, siempre entendiendo en cuenta que cargo es una aplicación de navegación y que el usuario tiene que tener todo a mano y no puede estar viendo buscando algo o sea, la idea siempre es que el UX sea lo más accesible posible y la verdad que yo estoy bastante contento, si lo no to, si me apúrenlo, no toco un poco a Mateur, a mí me gustaría hacer un poco más Pero, por ejemplo, si uno lo compara con Waze, y Waze está años luz, pero bueno, hay que tener cuenta que yo soy un desarrosador que lo hizo solo, y que me hice cargo de todo, entonces bueno, hice todo lo mejor que pude, y bueno, me da que pase el tiempo y que ya hace un poco más todo establecido, voy a ir ahí si ajustando detalles y cambie en algunas cosas, por ejemplo, de ella me extrañan la barra de búsqueda para abajo y llevar todo lo que son los menús para arriba en un icono de menús como muy como hace Waze, organizan un poco más de osciconos, pero bueno, eso lo veremos, porque tal vez que el cargo siempre fue una aplicación para carregores, y se está volviendo gracias a la gente, o sea que no me quedo de una aplicación de navegación sería y eso con lleva que hay que hacer algunos cambios y algunas mejores, pero creo que vamos por muy buen camino. Así que bueno, eso fue todo por este vídeo, si le gustó de me gusta, la verdad que muchas gracias también por el primer vídeo de cargo, el apoyo que tuvo, la verdad que fue increíble. Si le gustó de me gusta, suscribanse, el próximo día que se viene a hacer de desarrollo mismo, o sea vamos a hablar de lo que es vaquend, frontend, de la tecnología, de por qué elegir una cosa, porque elegir otra, de escala habilidad, posible migración del vaquend, Me todo de pago también y demás, así que bueno, nos vemos en el próximo vídeo, gracias por ver, chao chao.