{"id":2478,"date":"2018-03-07T14:35:47","date_gmt":"2018-03-07T14:35:47","guid":{"rendered":"http:\/\/www.mediosyenteros.org.ar\/home\/?p=2478"},"modified":"2018-03-07T14:35:47","modified_gmt":"2018-03-07T14:35:47","slug":"herramientas-para-el-diseno-de-apps","status":"publish","type":"post","link":"https:\/\/mediosyenteros.unr.edu.ar\/?p=2478","title":{"rendered":"Herramientas para el dise\u00f1o de apps"},"content":{"rendered":"<p>El dise\u00f1o de una aplicaci\u00f3n consta de varias etapas en las que se va construyendo y delineando el\u00a0 proyecto. Antes de llegar a la instancia de programaci\u00f3n, se trabaja con wireframes, que son los primeros bocetos de la app, para pasar luego al prototipo o mockup, donde se pueden testear las opciones pensadas. Son diversos los formatos en los que se puede plasmar la idea planteada.\u00a0 Una de las alternativas para el dise\u00f1o de prototipo es a trav\u00e9s de herramientas en l\u00ednea. Hay algunas simples y otras m\u00e1s avanzadas, pero todas ayudan en la tarea de representar de manera\u00a0 m\u00e1s clara c\u00f3mo se ver\u00eda la app y no es necesario tener conocimientos de programaci\u00f3n. Como dec\u00edamos, se pueden encontrar algunas gratuitas, con funciones avanzadas de pago; otras requieren alg\u00fan conocimiento de ingl\u00e9s. A continuaci\u00f3n veremos algunas m\u00e1s en detalle.<\/p>\n<p><strong><u>MockFlow\u00a0<\/u><\/strong> <a href=\"http:\/\/www.mockflow.com\/\">www.mockflow.com<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2516\" src=\"http:\/\/www.mediosyenteros.org.ar\/home\/wp-content\/uploads\/mockflow-300x139.png\" alt=\"\" width=\"695\" height=\"322\" \/><\/p>\n<p>Este servicio permite crear un prototipo de app, de manera colaborativa entre varios usuarios, con diferentes niveles de permisos. Los wireframes son interactivos, simulan la navegaci\u00f3n del usuario. Las cuentas gratuitas habilitan a construir un wireframe con un m\u00e1ximo de cuatro p\u00e1ginas. El proyecto se va creando a trav\u00e9s de plantillas, con la posibilidad de personalizarla tan solo arrastrando los elementos: botones, \u00edconos, im\u00e1genes. Incluso genera el gr\u00e1fico que permite visualizar la arquitectura de la app. Una vez finalizado, se puede exportar en diversos formatos: .ppt, .pdf o .png.<\/p>\n<p>Posee versi\u00f3n gratuita con opciones avanzadas de pago. Solo en ingl\u00e9s.<\/p>\n<p><strong>Ninja Mock<\/strong> <a href=\"https:\/\/ninjamock.com\">https:\/\/ninjamock.com<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2511\" style=\"font-family: 'Droid Sans', 'Helvetica Neue', 'Nimbus Sans L', sans-serif; font-size: 15px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400;\" src=\"http:\/\/www.mediosyenteros.org.ar\/home\/wp-content\/uploads\/ninja-mockup-300x200.jpg\" alt=\"\" width=\"800\" height=\"534\" \/><\/p>\n<p>Permite crear proyectos para los dise\u00f1os tanto de iOS, Android como Windows Phone y Surface. Adem\u00e1s\u00a0facilita el trabajo colaborativo con otros usuarios y la posibilidad de crear un test de usabilidad. Es una herramienta muy amigable e intuitiva.<\/p>\n<p>La versi\u00f3n gratuita incluye todas las funciones, pero solo permite trabajar un proyecto. Otro aspecto interesante es que se puede utilizar de manera offline.<\/p>\n<p>Posee versi\u00f3n gratuita con todas las funciones disponibles, pero en modo abierto; para uso privado es necesario acceder a la versi\u00f3n de pago. Solo en ingl\u00e9s.<\/p>\n<p><strong>Proto.io<\/strong> <a href=\"https:\/\/proto.io\">https:\/\/proto.io<\/a><\/p>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2512\" src=\"http:\/\/www.mediosyenteros.org.ar\/home\/wp-content\/uploads\/say-hello@2x-300x150.png\" alt=\"\" width=\"738\" height=\"369\" \/><\/p>\n<p>Para ingresar es necesario registrarse, es una herramienta de pago que permite usarla por un tiempo de prueba. Se trata de una plataforma m\u00e1s compleja que las anteriores, pero que permite trabajar m\u00e1s en detalle y con funciones m\u00e1s avanzadas. Incluso, cuenta con la posibilidad de incluir botones vinculados a RV. Es ideal para el dise\u00f1o de prototipos, por su presentaci\u00f3n prolija y terminada. Incluso puede enviarse el proyecto a trav\u00e9s de SMS y chequear el funcionamiento simulado en el celular desde su propia app.<\/p>\n<p><strong>Balsamiq<\/strong>\u00a0 <a href=\"https:\/\/balsamiq.com\">https:\/\/balsamiq.com<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2514\" src=\"http:\/\/www.mediosyenteros.org.ar\/home\/wp-content\/uploads\/balsamiq-300x210.jpg\" alt=\"\" width=\"704\" height=\"493\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>Esta herramienta de trabajo en l\u00ednea permite crear wireframes con un formato estilo borrador. Al igual que las mencionadas, los elementos se agregan deslizando sobre el \u00e1rea de trabajo. La disposici\u00f3n del tablero es clara, cuenta con diferentes acciones que permiten personalizar el proyecto.<\/p>\n<p>Para su uso es necesario registrarse, es de pago, pero permite un per\u00edodo de prueba para trabajar.<\/p>\n<p><strong>Just in mind<\/strong> <a href=\"https:\/\/www.justinmind.com\">https:\/\/www.justinmind.com<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2515\" src=\"http:\/\/www.mediosyenteros.org.ar\/home\/wp-content\/uploads\/maxresdefault-300x169.jpg\" alt=\"\" width=\"705\" height=\"397\" \/><\/p>\n<p>Otra de las alternativas que permite la creaci\u00f3n de prototipos, pero con la diferencia que se descarga como un programa para la PC. Funciona de manera gratuita y se puede probar el funcionamiento en dispositivos, simulando los diferentes niveles de interacci\u00f3n.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>El dise\u00f1o de una aplicaci\u00f3n consta de varias etapas en las que se va construyendo y delineando el\u00a0 proyecto. Antes de llegar a la instancia de programaci\u00f3n, se trabaja con wireframes, que son los primeros bocetos de la app, para pasar luego al prototipo o mockup, donde se pueden testear las opciones pensadas. Son diversos [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":2516,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[24,36],"tags":[270],"class_list":["post-2478","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-edicion-no-21","category-recursos-en-la-web","tag-herramientas"],"_links":{"self":[{"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=\/wp\/v2\/posts\/2478","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2478"}],"version-history":[{"count":0,"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=\/wp\/v2\/posts\/2478\/revisions"}],"wp:attachment":[{"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2478"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2478"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mediosyenteros.unr.edu.ar\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2478"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}