Proyecto Krav Maga Global Latinoamerica (Primera Etapa) by Jainner Giron

ESTUDIO DE IMAGEN Y PROYECTO WEB LATINOAMERICANA DE

KRAV MAGA GLOBAL STUDY OF IMAGE AND LATIN AMERICAN WEB PROJECT

KRAV MAGA GLOBAL

Documento del desarrollo teórico de la imagen corporativa virtual y proyecto web para Latinoamérica. Del cual surgirá una nueva imagen de la corporación más importante del mundo en materia de tácticas y defensa personal y militar.

Document theoretical development of virtual corporate image and web project for Latin America. Which will emerge a new image of the most important in the world in terms of tactics and military personnel and defense corporation.

Estudio de Imagen y Proyecto web en Latinoamérica Krav Maga Global 1°ra parte del proyecto 22 de febrero 2016 Diseño, realización y contenidos Tito Pomenta y Jainner Girón

Diseñado por / Design by: J. Girón [Fotografía y Diseño] www.JGiron.photo

Image Study and web project in Latin America Krav Maga Global 1st part of the project February 22, 2016 Design, layout and content Tito Pomenta y Jainner Girón

ESTUDIO DE IMAGEN Y PROYECTO WEB LATINOAMERICANA DE

KRAV MAGA GLOBAL STUDY OF IMAGE AND LATIN AMERICAN WEB PROJECT

KRAV MAGA GLOBAL

INDICE INDEX

INTRODUCCIÓN pag 09 UNIDAD I Marco Teórico Concepto pag 11 Hosting pag 12 Dominio pag 16 UNIDAD II Reconocimmiento de Etapas Etapas pag 19 UNIDAD III Definición del Tema Definición

pag 23

UNIDAD IV Recopilación de antecedentes Recopilación pag 27 Referentes pag 30 UNIDAD V Viabilidad y contenido Contenido pag 35 Optimizacion SEO pag 36-37 UNIDAD VI Determinación de cronograma y presupuesto Cronograma pag 39 Presupuesto Hosting pag 41 Presupuesto Dominio pag 42 Presupuesto Diseño web pag 43 UNIDAD VII Control de variables de soporte Soportes pag 45 Usos de los widgets pag 46 UNIDAD VIII Control del a Arquitectura de la información Arquitectura pag 49 Arbol de navegación pag 50-51 UNIDAD IX Control de Diseño Diseño pag 55 CONCLUSIÓN pag 61

INTRODUCTION pag 09 UNIT I Theoretical Framework Concept pag 11 Hosting pag 12 Domain pag 16 UNIT II Recognition Stages Stages pag 19 UNIT III Definition Topic Definition

pag 23

UNIT IV Collection background Compilation pag 27 Referents pag 30 UNIT V Viability and content Content pag 35 Optimization SEO pag 36-37 UNIT VI Determination of schedule and budget Timetable pag 39 Budget Hosting pag 41 Budget Domain pag 42 Budget Web Design pag 43 UNIT VII Control variables support Stands pag 45 Uses of widgets pag 46 UNIT III Control to Information Architecture Architecture pag 49 Navigation tree pag 50-51 UNIT IV Control Design Design pag 55 CLOSURE pag 61

INTRODUCTION

INTRODUCCIóN

La internet ha convertido al mundo en un lugar del cual podemos saber más del mundo de manera eficaz e instantánea, hoy en día existe más que nunca el uso de la internet para negocios, entretenimiento y educación. Sin embargo, muchas de ellas no están bien diseñadas en su programación e imagen para darle interés a los usuarios, quedando sin visitas y peor aún olvidados. Hoy en los avances de la tecnología y mercadeo el uso de la internet se ha convertido en una herramienta para la empresa del cual quiere ser reconocido mundialmente. En este documento mostraremos como impulsar la imagen de Krav Maga Global en Latinoamérica y crear una estética de diagramación y diseño de la web para cada uno de los países que involucran en esta gran institución internacional, ya que muchas escuelas carecen de páginas web con la estética deseada por la institución principal e inclusive los países que tiene paginas propias de la escuela regional pero no muestran su contenido como una institución seria. Incluir en el proyecto en los dispositivos fijos como laptops o desktop información profunda de la escuela, y en los dispositivos móviles información al punto y necesaria para que usuario navegue más rápido en la página y ver lo que necesita. La integración de las redes sociales para mejor información viral y el uso de blogs para notas, y eventos periódicos. Esta ultimo ayudara a la escuela a colocar información que necesita ser escuchas por muchos con la utilización de las redes sociales. Queremos mostrar al mundo que Krav Maga Global es único, proyectando un futuro la imagen más moderna, actual y vanguardista.

The internet has turned the world into a place from which we can learn more about the world and instantly effective, today there is more than ever the use of the internet for business, entertainment and education. However, many of them are not well designed in its programming and image to give interest to users, running out visits and even worse forgotten. These advances in technology and marketing using the internet has become a tool for the company which wants to be recognized worldwide. In this paper we show how to promote the image of Krav Global Maga in Latin America and create an aesthetic layout and design of the web for each of the countries involved in this great international institution, as many schools do not have web pages with aesthetics desired by the lead institution and even the countries with the regional school own pages but do not show its content as a serious institution. Include in the project in fixed devices such as laptops or desktop deep school information, and mobile devices and point information necessary for user to navigate faster on the page and see what you need. The integration of social networks to better viral information and the use of blogs for notes, and recurring events. This latter will help the school to place information that needs to be bugged by many with the use of social networks. We want to show the world that Krav Maga Global is unique, projecting a more modern, current and future avant-garde image. 9

MARCO TEÓRICO

Unit i

Unidad i

THEORETICAL FRAMEWORK

CONCEPT

CONCEPTO

¿Qué es Multimedia? Según el diccionario de la Real Academia Española, Multimedia es todo objeto que utiliza conjunta y simultáneamente diversos medios, como imágenes, sonidos y texto, en la transmisión de una información. La Multimedia se clasifica de acuerdo a la interacción con el usuario, en base a esto, podemos definir tres tipos (Multimedia Lineal, Multimedia Interactiva e Hipermedia) Multimedia Lineal Se refiere cuando aplicación avanza de forma progresiva y el usuario no tiene el control sobre las acciones de las mismas. Multimedia Interactiva Cuando el usuario puede realizar determinadas acciones sobre la aplicación como hacer clic en algunos objetos o botones que le permitan controlar el avance de la misma. Hipermedia Cuando se combina la multimedia con el hipertexto, es decir, cuando se le permite al usuario tener mayor control de la aplicación mediante el uso de botones, textos, imágenes y otros objetos. ¿Qué es interactividad? Se entiende por interactividad a la acción que se ejerce recíprocamente entre dos o más objetos, agentes, fuerzas, funciones, etc. Junto a este concepto surge uno nuevo que es el de interfaz, el cual parte de una conexión física y funcional entre dos aparatos o sistemas independientes.

What is interactivity? It is understood interactivity to the action exerted mutually between two or more objects, agents, forces, functions, etc. Along with this comes a new concept which is the interface, which part of a physical and functional connection between two devices or independent systems.

What is Multimedia? Multimedia is any object that uses jointly and simultaneously various media such as images, sounds and text in the transmission of information. Multimedia is classified according to the interaction with the user, based on this, we can define three types (Multimedia Linear, Interactive Multimedia and Hypermedia) Linear Multimedia It refers when application progresses gradually and the user has no control over the actions of them. Interactive multimedia When the user can perform certain actions on the application and click on some objects or buttons that allow you to control the progress of it. Hypermedia When combined with multimedia hypertext, ie when the user is allowed to have more control over the application by using buttons, text, images and other objects. 11

UNIDAD I UNIT I

HOSTING Para elegir el hosting apropiado para el proyecto en cuestión, se deben considerar ciertas características y condiciones del negocio para el cual desarrollaremos la web. Por ejemplo:

HOSTING To choose the appropriate hosting for the project in question must be considered certain characteristics and conditions of business for which we will develop the web. For example:

• El público objetivo de la página por lo que si bien existen hostings cuyos servidores se encuentran en el extranjero que pueden ofrecer muy buenas relaciones precio/calidad y velocidad global, conviene en este caso contratar un hosting que podamos manejar nosotros y que funciona correctamente a nivel mundial (servidores locales), para evitar la latencia de larga distancia.

• The target audience of the page so that while there are hostings whose servers are located abroad that can provide very good relationship price / quality and overall speed, it is appropriate in this case to hire a web host that can handle us and working properly level global (local servers) to avoid long distance latency.

• El mantenimiento y soporte técnico también es un factor a considerar, y en este caso también es preferible que el servidor lo manejemos nosotros sin depender de agentes externos, que pueda recibir fácilmente consultas telefónicas, chat o videoconferencia, y que atienda en español/ingles. • Siendo un proyecto de web muy grande en tamaño (considerando los videos), requiere una gran cantidad de Gb de alojamiento para la colocación de fotografías o videos (los videos pueden ser colocados desde Youtube o Vimeo) en los blogs en este caso y la pagina tendrá una buena cantidad de imágenes que ayudara con su diseño, sus principales necesidades son las de un buen servicio y soporte. Estimamos que las páginas cada una ocupara entre 500 Mb a 2 Gb de espacio. En nuestro proyecto usaremos una interfaz interactiva, la cual permita al usuario navegar por lo distintos niveles del sitio, ayudado por botones, barras de scroll y enlaces, los cuáles conectarán con distintas páginas de redes sociales y sitios donde se puedan visualizar videos, en este caso usaremos la plataforma de youtube, la cual irá enlazada a la pestaña historia del sitio.

• Maintenance and support is also a factor to consider, and in this case it is also preferable that the server we handle us without relying on external agents, which can easily receive telephone inquiries, chat or video conference, and to address in Spanish / English. • Being a project of very large web in size (considering the videos), requires a lot of Gb hosting for placing pictures or videos (videos can be placed from Youtube or Vimeo) on blogs in this case and the page have a good number of images to help with their design, their main needs are for good service and support. We believe that pages each occupy between 500 MB to 2 GB of space.

In our project we use an interactive interface, which allows the user to navigate through the different levels of the site, helped by buttons, scrollbars and links, which connect you to different pages and social networking sites can watch videos in this case we will use the YouTube platform, which will be linked to the history of the site tab.

UNIDAD I UNIT I

¿Que entregamos a las instituciones de cada país? Hosting: Plataforma Capacidad de espacio Transferencia mensual Buzones / Cuentas de correo Panel de control Dominios alojables Subdominios Cuentas FTP Uptime %99.99

Windows 350 Gb 3.500 Gb 50 10 100 100

Características de Email: Deskmail y Webmail Bloqueo de Spam y Virus Redireccionamiento de correo Respuestas automáticas POP3/SMTP Email Base de Datos: MySQL phpMyAdmin Microsoft Access Microsoft SQL Server 2005

Características avanzadas: IIS7 / IIS6 ASP.NET 3.0 / 2.0 / 1.1 AJAX 1.0 .NET Framework 3.5 ASP (Active Server Pages) PHP4 / PHP5 Perl5 SSI (Server Side Includes) CGI-BIN Flash/Shockwave Audio/Video Streaming Estadísticas de Visitas Directorios protegidos Backup Web Diario Soporte técnico permanente Tecnología: • Quad GigE Fiber Uplink: Redundancia GigE (Gigabit Ethernet) conectado con fibra óptica • Data Center: 2 Data Centers de Case A • Tecnologia de Router: Redundancia completa en el harware de redes en los Data Centers • Servidores Dell: Alta performance con Servidores Data Centers Dell • Sistema Operativo: Windows 2003 ofrece el más flexible, seguro, avanzado y rápida plataforma para tu web • UPS Power: Sistemas UPS brindan consistencia y energía limpia además de backup en caso de fallo de energía externo • Generador de Backup: En caso de falla de energía externa se cuenta con un generador preparado

What we deliver to the institutions of each country? Hosting: Platform Space capacity Monthly transfer Mailboxes / Email Accounts Control Panel Hosted domains Subdomains FTP accounts Uptime %99.99

Windows 350 Gb 3.500 Gb 50 10 100 100

Email features: Deskmail y Webmail Bloqueo de Spam y Virus Blocking Spam and Virus Autoresponders POP3/SMTP Email Database: MySQL phpMyAdmin Microsoft Access Microsoft SQL Server 2005

Características avanzadas: IIS7 / IIS6 ASP.NET 3.0 / 2.0 / 1.1 AJAX 1.0 .NET Framework 3.5 ASP (Active Server Pages) PHP4 / PHP5 Perl5 SSI (Server Side Includes) CGI-BIN Flash/Shockwave Audio/Video Streaming Visitors Statistics Protected directories Backup Web Journal Permanent support Technology: • Quad GigE Fiber Uplink: Redundant GigE (Gigabit Ethernet) connected with fiber optics • Data Center: 2 Data Centers Case A • Technology Router: complete redundancy in hardware networking Data Centers • Dell Servers: High performance with Servers Data Centers Dell • OS: Windows 2003 offers the most flexible, reliable, advanced and rapid platform for your website • UPS Power: UPS systems provide consistency and clean energy plus backup in case of failure of external power • Generator Backup: In case of failure of external power it has a generator ready 15

UNIDAD I UNIT I

DOMINIO Nuevamente la localidad de el público objetivo hará que prime la opción de un dominio .com con la extensión del país relacionado, eso ayudara a unificar los dominios, nuestro modelo de planteamiento de dominio seria kravmagaglobal.com, y colocar sus respectivas extensiones, ejemplo: .ve, .pe, .cl, .co, etc. Es preferible que los dueños de la institución de cada país compren el su dominio, les pedimos que nos den las claves de acceso para colocar los DNS y direccionar el dominio al hosting. La tarifa para la inscripción del dominio es depende del país de residencia, generalmente se compra con su propia moneda o con la unidad tributaria si en caso que el dominio es una institución gubernamental, si en cuyo país no tiene la empresa que administra dominios locales se puede adquirir el dominio a través de godaddy.com pero es más costoso.

DOMINIO Again the locality of the target audience will prime the option of a .com domain with the extension of the country related, that help unify domains, our model domain kravmagaglobal.com serious approach, and place their respective extensions, such as: .ve, .pe, .net, .co, etc. It is preferable that the owners of the institution of the country buy your domain, we ask you to give us access keys to place and route the DNS domain hosting. The fee for the registration of the domain is depends on the country of residence, usually purchased with their own money or the tax unit if the domain is a government institution, whether in whose country does not have the company that manages local domains you can acquire the domain through godaddy.com but is more expensive.

RECONOCIMIENTO DE ETAPAS

Unit iI

Unidad iI

RECOGNITION OF STAGES

Planificación del sitio Para el desarrollo de los sitios web que cumpla su función, se debe definir dichas funciones. En el caso de nuestro proyecto, el objetivo principal es el de expandir la institución de la enseñanza marcial militar y civil, y esto se logra a través de una correcta comunicación y promoción del mismo. En este proceso, identificamos las siguientes tareas:

stages

Etapas

Conocer el plan de negocio de la empresa: Para una planificación efectiva del proyecto, se debe entender primero como funciona la institución. Esto involucra la definición de los contenidos y biografías, la especificación de los cursos, seminarios, productos o servicios ofrecidos, y el público objetivo al cual está dirigido el instituto. Definir el mercado objetivo y perfil de usuario del sitio: Que tipos de usuario son importantes para el instituto, y en qué orden de prioridad. Algunos grupos de usuario claves son: Clientes existentes, prospectos, proveedores, asociados, empleados, etc. Comprender el medio: Internet es un ambiente técnico que cambia de manera muy rápida, es por ello que se debe conocer cómo se navega y que mecanismos y dispositivos existen para ello, cómo funcionan los motores de búsqueda, cual es el estado actual de la banda ancha y cuál es la penetración de la internet en su país, que funciones son populares para la experiencia de navegación actualmente, etc. Definición de funciones del sitio: Cuáles son las tareas que realizarán los usuarios en el sitio, a que contenidos podrán acceder. Mapa de Navegación: Define el tamaño y alcance del sitio, y visualiza las rutas que tomarán los usuarios al navegar el sitio.

Site Planning For the development of websites that fulfill its function, you define these functions. In the case of our project, the main objective is to expand the institution of military and civilian martial teaching, and this is achieved through proper communication and promotion. In this process, we identified the following tasks: Knowing the business plan of the company: For effective project planning, you should first understand how it works the institution. This involves defining the contents and biographies, specification of courses, seminars, products or services offered, and the target audience which is aimed school. Define the target market and user profile on the site: User types that are important for the institute, and in what order of priority. Some key user groups are: Existing customers, prospects, suppliers, partners, employees, etc. Understand the environment: Internet is a technical environment that changes very quickly, which is why you must know how to navigate and mechanisms and devices exist for it, how search engines, which is the current state of broadband and what work Internet penetration in the country, which are popular for functions currently browsing experience, etc. Defining features of the site: What are the tasks to be performed by users on the site, will have access to content. Navigation map: Define the size and scope of the site, and displays the routes that take users to navigate the site. 19

UNIDAD Ii UNIT Ii

Definición de los objetivos de la web: A través de una serie de investigaciones, se definen los objetivos de la web, cuál es el mensaje que pretende proyectar y que es lo que busca con el sitio. Desarrollo de la estructura del sitio web: La estructura forma parte importante de la pre-producción del proyecto, se definen lugares específicos en donde irá cierta información y los comportamientos que estos espacios, tendrán. Diseño y producción: Una vez aprobadas las muestras presentadas a nuestro cliente, se inicia la etapa de desarrollo de propuestas gráficas. Pruebas y comprobaciones: Para la pruebas y comprobaciones de nuestro sitio, deben participar todos o gran parte de los involucrados en el proyecto, tanto el cliente cómo el equipo desarrollador. En estas pruebas se revisa el uso de la interfaz, la correcta vinculación de imágenes y direcciones. Publicidad y marketing: El posicionamiento del sitio es fundamental para dar a conocer el proyecto, por este motivo se planifican diferentes estrategias para promocionar la página web, una de ellas es a través de las redes sociales las cuáles son visitadas con frecuencia por los clientes potenciales. Otro método de comunicación es el tradicional impreso el cuál se entregará a los interesados en obtener información acerca del producto que ofrece la institución o escuela, de la función que cumple el folleto es la de integrar en su gráfica, la dirección del sitio web de Krav Maga. Actualizaciones: Con respecto a las actualizaciones que puede requerir el sitio, nuestro cliente prefiere que nuestro equipo realice las actualizaciones de su página web, ya que su conocimiento acerca de archivos HTML, CSS y servidores, es nulo. 20

Definition of the objectives of the web: Through a series of investigations, the objectives of the web are defined, what is the message you hope to project and what you want with the site. Developing the website structure: The structure is an important part of the pre-production of the project, specific locations where certain information will go and behaviors that these spaces will be defined. Design and production: Once the samples submitted to our client approved, the stage of development of design concepts starts. Tests and checks: For testing and verification of our site, they should involve all or most of those involved in the project, both the client and the development team. In these tests the use of the interface, the correct addresses linking images and is reviewed. Advertising and marketing: The positioning of the site is essential to publicize the project, which is why different strategies to promote the website, one of them is through social networks which are frequently visited by potential customers are planned. Another method of communication is the traditional printed which stakeholders will be delivered information about the product offered by the institution or school, the role of the brochure is to integrate into your graph, the website address Krav Maga. Updates: Regarding updates that may require site, our customers prefer our team perform updates to your website, as your knowledge about HTML, CSS and server files is null.

Etapas de desarrollo Objetivos de la Web y equipo de Proyecto Objetivos de la página web definidos por una entrevista con el cliente, estas son atraer y dar información para el interesado en esta disciplina, informar rápidamente a los alumnos de la agenda de clases para la semana. Equipo de proyecto conformado por Diseñadores con conocimiento en html, ccs, javascrip y editorial. Estructura de Sitio Web Estructura definida por los requerimientos del cliente, por un menú simple, con información definida y de fácil acceso se crea árbol de navegación y wireframes para dar un boceto de idea al cliente. Diseño y Producción Una vez definida la estructura y los wireframes son aprobados se da paso a la etapa de diseño de las gráficas estáticas, donde se realiza un análisis gráfico, y tipográfico, para llegar al diseño final que igualmente pasara por las manos del cliente para su aprobación. Pruebas y Correcciones Luego de la aprobación de las gráficas estáticas, se pasa a la etapa de armado en html, ocupando todas las tecnologías que se especificaron en las reuniones con el cliente. Se subirá la página web en una dirección de prueba por ejemplo un hosting gratuito como ZobyHost, en las pruebas participaran todo el equipo de diseño. Publicidad y Marketing Se realizarán las acciones de Marketing que se definieron con el cliente en el precio estipulado, estas son posicionamiento básico con google +1, utilización de palabras claves, la no utilización de flash para mejor posición en los buscadores. Actualizaciones Se descartó el uso de CMS por el nivel informático de nuestro cliente, por la baja frecuencia de actualización que tendría y por mantener un cliente en el tiempo. En caso de que nuestro cliente requiera actualización deberá hacernos saber para efectuar las tareas acordes.

Stages of development Web and objectives of the project team Objectives of the web page defined by an interview with the client, these attract and provide information for those interested in this discipline, quickly inform students of the class schedule for the week. Project team consisting of designers with knowledge of html, ccs, JavaScript and publisher. Web Site Structure Structure defined by customer requirements, by a simple menu, with defined and easily accessible information navigation tree and create wireframes to give a sketch idea to the customer. Design and Production Having defined the structure and wireframes are approved it gives way to the design stage of static graphics, where a graphic analysis is performed, and typographical, to reach the final design which also pass through the hands of the customer for approval. Testing and Corrections After approval of the static graphics, it is passed to the stage of armed html, occupying all the technologies that were specified in the meetings with the client. the website will be uploaded in a test address such a free hosting as ZobyHost, participate in testing the entire design team. Advertising and marketing Marketing actions that were defined with the customer at the stipulated price, these basic positioning google +1, use of keywords, not to use flash for better position in search engines will be made. Updates CMS using the level of our customer, the low refresh rate and would keep a client in time is discarded. If our client requires update should let us know to perform the tasks chords.

DEFINICIÓN DEL TEMA

Unit iIi

Unidad iIi

DEFINITION OF SUBJECT

DEFINITION

DEFINICIÓN

Definición del tema. La temática de los sitios es Krav Maga Global, es el sistema oficial de lucha y defensa personal usado originalmente por las fuerzas de defensa y seguridad israelíes. Actualmente en el mundo, existen en todas partes, la más importante es la de Israel que es el principal exponente de este sistema de defensa personal, dirigido por Eyal Yanilov. Objetivo del proyecto Para trazar los objetivos del proyecto resulta útil considerar las siguientes preguntas: • ¿Se busca vender más a los clientes existentes? • ¿Se busca adquirir nueva clientela? • ¿Se busca abordar nuevos mercados?, ¿Cuáles? • ¿Se ofrecerán servicios Online?, ¿Se busca reducir costos de marketing? • ¿Se ofrecerá Community Manager a cada uno de ellos? ¿Igualmente SEO? Las páginas deberían apoyar los planes de negocio trazados por la institución, por lo que el principal objetivo del proyecto es la expansión de la clientela en Latinoamérica. Esto se logra orientado el sitio hacia una mayor y mejor entrega de información acerca de precios, lugares de entrenamiento, horarios, etc, pero también a la difusión este arte. Esta funcionalidad contempla la posibilidad de un contacto más directo con el profesor (aludiendo a la incorporación de redes sociales) para simplificar las cosas al usuario. Eso quiere decir que hay que implementar Community Manager en cada uno de los sitios web.

Defining the issue. The theme of the sites is Krav Maga Global, is the official system of fighting and self-defense originally used by the Israeli defense forces and security. Currently in the world, exist everywhere, the most important is Israel that is the leading exponent of this system of self defense, led by Eyal Yanilov. Objective of the project • To trace the project’s objectives is useful to consider the following questions: • Are you looking to sell more to existing customers? • Are you looking to acquire new customers? • Is it seeks to address new markets ?, What? • ¿Online services offer ?, It is intended to reduce marketing costs? • ¿Community Manager will be offered to each of them? Also ¿SEO? The pages should support business plans outlined by the institution, so that the main objective of the project is the expansion of the customer base in Latin America. This is achieved oriented site towards greater and better delivery of information about pricing, training venues, schedules, etc, but also to spread this art. This functionality includes the possibility of a more direct contact with the teacher (referring to the incorporation of social networks) to keep things simple for the user. That means you have to implement Community Manager in each of the websites. 23

UNIDAD Iii UNIT Iii

Definición del usuario. Al considerar quienes serán los usuarios del sitio, es mejor considerar la generalidad más que algún grupo en particular. La audiencia no estará determinada por la clase de tecnología usada para acceder al sitio, una verdadera definición de la audiencia consistiría en quienes son, y cuáles son sus objetivos. Consideramos que un sitio web de esta categoría está dirigido principalmente a clientes potenciales de recursos medio-altos, es decir, clases sociales a partir de un nivel C3 con un rango de edad entre 18 a 40 años. Son personas que buscan mejorar su condición física, habilidad y confianza, que deseen aprender un sistema de autodefensa o interesados en el Krav Maga, su historia y principalmente, información acerca del instructor, estilos practicados y formas de contacto. De esto, se desprende que la página deberá contar con la información profesional del instructor, métodos de contacto y dirección física, así como historia de la disciplina, noticias, etc.

User definition. When considering who will be the users of the site, it is better to consider more than any particular group generality. The audience will not be determined by the kind of technology used to access the site, a true definition of the audience would be who they are, and what their objectives. We believe that a website in this category is mainly aimed at potential customers of medium-high resources, ie social from a C3 level with an age range between 18 to 40 classes. They are people looking to improve their fitness, skill and confidence, who want to learn a system of self-defense or interested in Krav Maga, history and mainly information about the instructor, practiced styles and forms of contact. From this, it follows that the page must have the professional instructor information, contact methods and physical address, and history of the discipline, news, etc.

Extracto socio econ贸mico de Usuario Extract economic partner of user

RECOPILACIÓN DE ANTECEDENTES

Unit IV

Unidad IV

BACKGROUND COLLECTION

Compilation

Recopilación

Es una fase que nos va a ayudar a establecer un punto de partida y a definir metas que se tendrán que cumplir con el proyecto en cuestión. Nos proporciona una guía para trazar cuáles serán las posibles soluciones al comienzo de cualquier proyecto, sea cual sea la rama de diseño, gráfico, web, interiores o industrial. EL BRIEF Es un resumen en el que se da cuenta de las características, metas y entorno de una empresa o producto. Esta información y proceso de conocimiento del cliente nos acerca más a sus necesidades para así tener un mejor panorama para realizar una planeación más efectiva. A grandes rasgos, un brief debe contener información general de la empresa (nombre, dirección, teléfono, sitio web, etc.) e información sobre diversos aspectos de la empresa, por ejemplo, su “filosofía”, su público objetivo, su competencia, el medio en el que se desenvuelve, etc. Es importante dejar abierta la posibilidad para el cliente de añadir lo que considere pertinente en el brief, así como tener en consideración las estrategias comunicacionales y de manejo de imagen pasadas de la empresa.

It is a phase that will help us to establish a starting point and to set goals that will have to fulfill the project. We provide a guide to trace what the possible solutions are at the beginning of any project, whatever the branch design, graphic, web, interior or industrial. THE BRIEF It is a summary that realizes the characteristics, goals and environment of a company or product. This information and process customer knowledge brings us closer to their needs in order to have a better picture for a more effective planning. Roughly a brief must contain general information about the company (name, address, phone number, website, etc.) and information on various aspects of the company, for example, his “philosophy”, their target audience, your competition, the environment in which it operates, etc. It is important to leave open the possibility for the customer to add what it deems appropriate in the brief, as well as take into consideration the communication and management of the company image past strategies. 27

UNIDAD IV UNIT IV

Evaluación de antecedentes A partir del brief elaborado para el proyecto de los sitios de Krav Maga Global Latinoamérica conseguimos profundizar nuestro conocimiento sobre cómo abordar las necesidades de nuestro cliente, y qué conceptos son los que deseamos proyectar a través de la página.

Assessment history From the brief prepared for the project sites Krav Maga Global Latin America we get deepen our knowledge on how to address the needs of our customer, and what concepts are those that want to project through the page.

Sobre nuestro cliente. Nos dimos cuenta de que, para nuestro cliente, su negocio conlleva necesariamente la necesidad de expandir la disciplina, y que esta se traspase a sus alumnos es su razón de ser maestro. Que las personas interesadas tengan un lugar donde informarse, tener acceso a lugares de práctica y conocer este arte de defensa personal a través de imágenes o videos.

About our client. We realized that for our customer, your business necessarily entails the need to expand the discipline, and that their students is carried forward is their raison d’etre teacher. Interested persons have a place to learn, have access to local practice and learn this art of self defense through images or videos.

A esto se suma una dimensión valórica del Krav Maga Global que se relaciona con su historia: fue creado por Imi Lichtenfeld en la década de los 40 específicamente para defenderse de las agresiones de los nazis en Alemania. Actualmente la sede central es en Israel por lo tanto se dan asociaciones de conceptos como: Israel – judío – estrella de David; y en otro plano, aunque en la versión de Krav Maga Global se relaciona con el símbolo judío, el que es una disciplina que agrupa técnicas de varias artes marciales y se perfila como uno de los métodos más efectivos y letales de autodefensa (conceptos: defensa personal – cuerpo humano – militar). Sobre el público objetivo. El cliente también nos proporcionó información crucial para entender el público objetivo de la empresa, punto que ha sido desarrollado en el capítulo III. Se desglosa que los segmentos con mayor representación son adulto-joven y adulto, clase media-alta, que destinan tiempo después de sus empleos o estudio. Es necesario optimizar la información de forma que llegue lo más rápido cuando ellos lo necesitan, para que no sientan que es una pérdida de tiempo. Sobre la competencia y el medio del negocio. A nivel mundial existe varias institucio-nes que forma la instrucción de Krav Maga, como son Krav Maga Worldwide, Coman-do Krav Maga, Krav Maga Bukan, REKM (Roy Elghanayan’s Krav Maga Los Angeles). Se considera competencia directa además a distintas academias de otras disciplinas, que intentan responder a las mismas necesidades/público; y como competencia indirecta, a otros centros de deporte o recreación que apunten a un público similar. 28

Was created by Imi Lichtenfeld in the 40s specifically to defend against attacks by the Nazis in Germany: to that a value dimension of Krav Maga Global that relates to your story adds. Currently the headquarters is in Israel therefore concepts such associations exist: Israel - Jewish - Star of David; and on another level, although in the version of Krav Global Maga is related to the Jewish symbol, which is a discipline that brings together techniques from various martial arts and is emerging as one of the most effective and lethal methods of self-defense (concepts: defense staff human body - military). On the target audience. The client also provided crucial to understanding the target audience of the company, a point that has been developed in Chapter III information. It breaks down the segments with the highest representation are adult-young adult, upper-middle class, who spend time after their jobs or study. You must be optimized so that the information arrives as quickly when they need it, so they do not feel it’s a waste of time. Competition and business medium. Worldwide there are several institu tions-forming Krav Maga instruction, such as Krav Maga Worldwide, Coman-do Krav Maga, Krav Maga Bukan, REKM (Roy Elghanayan’s Krav Maga Los Angeles). Direct competition is considered in addition to various academies of other disciplines, trying to answer the same needs / public; and as competition indi-straight, other sport or recreation centers aimed at a similar audience.

BRIEF El cliente desea entregar su producto a clientes potenciales, para esto necesita entregar cierta informaci贸n relevante al equipo desarrollador para as铆 generare propuestas graficas al sitio y canales de difusi贸n efectivos. BRIEF The customer wants to deliver your product to potential customers, for this you need to deliver some information relevant to the development team so generare graphics to the site and effective dissemination channels proposed.

UNIDAD IV UNIT IV

Referentes La búsqueda de referentes es a la vez un sondeo del estado actual de una parte del diseño web (de empresas pequeñas), y arroja luz sobre características de las gráficas y de ordenamiento de la información en el caso particular de las academias de artes marciales. Vemos webs realizadas en html5, CSS3, y la utilización de javascript, también utilizan botones de link a otras páginas como Facebook, Twitter y Youtube, utilización de mapas para la ubicación de lugares de entrenamiento. Estas páginas minimizan el uso de flash para poder ocupar los sistemas de búsqueda. Utilización de paleta de colores oscuras que hace referencia al estilo de sobrevivencia en calle de Krav Maga Global.

Referents The search for references is both a survey of the current state of a part of web design (small business), and sheds light on characteristics of the graphs and ordering information in the particular case of martial arts academies. We webs made in html5, CSS3, and the use of javascript, also use buttons link to other pages like Facebook, Twitter and Youtube, use of maps for the location of training venues. These pages minimize the use of flash to fill search systems. Using dark colors palette that references the style of survival in street Krav Maga Global.

www.kravmagaworldwideacademy.com

www.kravmagaworldwide.pe

www.kravmagala.com

www.commandokravmaga.com/

UNIDAD IV UNIT IV

Pagina principal de la Organizaci贸n Krav Maga Global Headquarters www.krav-maga.com

Pagina principal de la Organizaci贸n Krav Maga Global Venezuela www.kravmagaglobal.com.ve

VIABILIDAD Y CONTENIDO

Unit v

Unidad v

VIABILITY AND CONTENT

CONTENT

CONTENIDO

La importancia de los contenidos para un sitio web es algo evidente: sin ellos la comunicación es un gesto sin mensaje. Los contenidos son los que informan y convencen a los usuarios. La temática de los contenidos del sitio es información acerca de precios, lugares de entrenamiento, horarios, etc., pero también a la difusión esta disciplina. En nuestro proyecto los distinguimos según su tipo: Textos: presentes en noticias, actualizaciones de estado, información sobre el Krav Maga, sobre el instructor, etc. Parte de estos textos provienen de la página antecesora de la nuestra, otra parte que nuestro cliente nos proporcionó en relación a lo que deseaba comunicar, y otra son los textos generados por la integración de redes sociales en el sitio. Imágenes y Videos: Proporcionados por el cliente en su totalidad. Las imágenes fueron tomadas a 180 dpi que serán retocadas según sea necesario y optimizadas para la web a 72 dpi. La viabilidad del sitio está fuertemente atada a factores materiales como la disponibilidad tecnológica y de presupuesto, puntos que también son abordados en otros capítulos. Entre otros factores que afectan la viabilidad del sitio se encuentran la competencia tecnología de la persona que se encargará de mantener la página. Nuestro cliente nos indicó que sus conocimientos de programación son nulos y que tiene poco tiempo disponible para poder optimizar imágenes y contenido, por eso solicitó pedir actualización al administrador cada vez que sea necesario por un costo asociado por definir.

The importance of content for a website is obvious: without them communication is a gesture without message. The contents are the reporting and convince users. The theme of the site’s content is information about prices, training venues, schedules, etc., but also to spread this discipline. In our project we distinguish them according to their type: Texts: You present news, status updates, information about Krav Maga, on the instructor, etc. Some of these texts come from the predecessor ours page, another part that our client gave us regarding what he wanted to communicate, and other texts are generated by integrating social networking site. Pictures and Videos: Provided by the customer in full. The images were taken at 180 dpi to be retouched as required and optimized for the web to 72 dpi. The viability of the site is strongly tied to material factors such as technological availability and budget, points are also addressed in other chapters. Among other factors affecting the viability of the site are competing technology person who will maintain the page. Our client told us that their programming skills are null and has little time available to optimize images and content, so he asked ask the administrator update whenever necessary for a cost associated defined. 35

UNIDAD V UNIT V

Optimización de Motores de Búsqueda (SEO) La optimización de los motores de búsqueda sigue la formula “si no pueden encontrarte, no existes”. Muchos sitios hacen uso excesivo Flash y otros gráficos que pueden ser atractivos para los usuarios, pero para los motores de búsqueda son invisibles. La idea es controlar la estructura de la página de modo de mejorar el posicionamiento del sitio en los motores de búsqueda. La repetición de determinadas palabras clave, títulos y textos del sitio, links entrantes y salientes, etc., son factores que bien manejados, aportan a la competitividad general del negocio.

búsqueda realizada y el momento en que se hizo, por lo que usualmente el público que es llevado a la web publicitante se corresponde con el público objetivo del negocio. Dichos anuncios es que se pagan por click, es decir que cada vez que el anuncio es clickeado, aumenta el costo del mismo. Este tipo de promoción no fue considerada en el encargo del cliente para el sitio, por lo que no será considerada su implementación. Optimización de Redes Sociales (SMO) La masividad de plataformas como Facebook, Twitter, Youtube o LinkedIn ha ido adquiriendo cada vez más importancia para negocios que desean promocionarse a través de internet. Esto se realiza normalmente tanto mediante anuncios pagados comunes, los que por lo general usan la información personal de los usuarios para determinar que anuncios le serán mostrados, y como la promoción que se difunde utilizando a los propios usuarios como promotores indirectos. El mejor ejemplo de esto es el botón “Me Gusta” de Facebook.

Nuestro sitio considera el SEO, y por ello han sido implementados pasos particulares como el buen manejo de palabras clave, y en puntos importantes del código de la página como las descripciones meta, y los atributos alt y title de imágenes y links, y el control de otros puntos críticos como lo sería la verificación del contenido del header 1 y una estrategia de mejora del atractivo de crosslinks y de links internos. Dentro de este punto se incluiría también el nombre del dominio, kravmagarm.cl (Krav Maga Región Metropolitana), de acuerdo a un criterio que prioriza el uso de las palabras claves más relevantes. Marketing de Motores de Búsqueda (SEM) El SEM se basa en anuncios pagados (como Google AdWords). Su relevancia radica en que son mostrados basándose en los términos de la 36

En el caso del sitio desarrollado, la presencia en las redes sociales está enfocada en una promoción indirecta a través de Facebook, Twitter, Youtube y Google+. El posicionamiento en buscadores, optimización en motores de búsqueda u optimización web es el proceso técnico mediante el cual se realizan cambios en la estructura e información de una página web, con el objetivo de mejorar la visibilidad de un sitio web en los resultados orgánicos de los diferentes buscadores. También es frecuente encontrar la denominación en inglés, search engine optimization, y especialmente sus iniciales SEO. Las personas que realizan tareas de optimización en motores de búsqueda se denominan posicionadores web, o en inglés search engine optimizers (cuyas iniciales también son SEO).

Search Engine Optimization (SEO) Optimization of search engines follows the formula “if they can not find you, do not exist”. Many sites make excessive use Flash and other graphics that can be attractive for users, but for search engines are invisible. The idea is to control the structure of the page so as to improve the positioning of the site in search engines. The repetition of certain keywords, titles and texts of the site, inbound and outbound links, etc., are factors that well managed, contribute to the overall competitiveness of the business. Our site considers the SEO, and have therefore been implemented individual steps as good management of keywords, and important points of code page as meta descriptions, and alt and title images and links attributes, and control other critical points as it would check the contents of the header 1 and a strategy for improving the attractiveness of crosslinks and internal links. Within this point the domain name, kravmagarm.cl (Krav Maga Metropolitan Region), according to a criterion that prioritises the use of the most relevant keywords would also be included. Search Engine Marketing (SEM) The SEM is based on paid ads (like Google AdWords). Its relevance is that are displayed based on the terms of the search performed and when it was done, so usually the audience is taken to the web publicitante matches the target audience of business. These ads are paid per click, ie each time the ad is clicked, it increases the cost thereof. This type of promotion was not considered in the customer’s order for the site, so it will not be considered implementation.

want to promote themselves via the Internet. This is usually done both by common paid ads, which usually use the personal information of users to determine which ads will be shown, and as the promotion that spreads using the users themselves as indirect promoters. The best example of this is the “Like” button on Facebook.

In the case of developed site, the presence in social networks is focused on indirect promotion through Facebook, Twitter, Youtube and Google+. Search engine optimization, optimization in search engines and web optimization is the technical process by which changes are made to the structure and information from a website, with the aim of improving the visibility of a website in the organic results different search engines. It is also common to find the name in English, search engine optimization, SEO and especially their initials. People who perform optimization tasks on search engines is called web positioners, or English search engine optimizers (whose initials are also SEO).

Social Media Optimization (SMO) The massiveness of platforms like Facebook, Twitter, YouTube or LinkedIn has become increasingly more important for businesses that 37

DETERMINACIÓN DE CRONOGRAMA Y PRESUPUESTO

Unit vi

Unidad vi

DETERMINATION AND BUDGET TIMELINE

TIMETABLE

CRONOGRAMA

Su elaboración puede responder a distintas necesidades, por ejemplo, comunicar aspectos relacionados con los tiempos y plazos, planificar recursos, como herramienta de seguimiento, que nos de soporte para calcular el flujo financiero del proyecto. Dependiendo del uso que le daremos, tendremos que decidir sobre como lo elaboraremos, pero de todos modos el cronograma base probablemente sea siempre el que usemos para gestionar los tiempos. Se deben considerar como fundamentales la determinación de los principales entregables del proyecto y su jerarquía. La consulta al equipo de proyecto nos ayudara a no perder de vista el alcance de este, para alcanzar un equilibrio entre no olvidar nada importante y tener un detalle abrumador que dificulte el uso de la información. A partir de estas metas, se determinan las actividades necesarias para realizarlos. La cantidad de actividades deberá tener relación con el nivel de control que necesitemos ejercer luego. Finalmente, se establece la secuencia de las actividades recordando cuales son obligatorias y cuales son optativas, ya que en caso de tener que reducir plazos o presupuesto esta información será vital. La estimación del esfuerzo de cada actividad (en horas-hombre), nos otorga control sobre la duración de las tareas.

Its development can respond to different needs, for example, communicate aspects times and deadlines, plan resources, as a monitoring tool, to support us to calculate the financial flow of the project. Depending on the use we give, we have to decide on how to work it out, but still the basic schedule probably always we use to manage time. They should be considered as fundamental the determination of the major deliverables of the project and its hierarchy. The consulting project team will help us not lose sight of the scope of this, to achieve a balance between not forget anything important and have an overwhelming detail that hinder the use of information. From these goals, the actions needed to implement are determined. The amount of activities must be related to the level of control we need exercise then. Finally, remembering sequence of activities which are mandatory and which are optional, as if having to reduce budget deadlines or this information is vital is established. The estimation of effort for each activity (man-hours), gives us control over the duration of tasks. 39

UNIDAD Vi UNIT Vi

US $5 0.0 0

nual 00 a 60, 1 $ US

IN IO

G TIN HOS

VII

CONTROL DE LA ARQUITECTURA DE LA INFORMACIÓN CONTROL ARCHITECTURE OF THE INFORMATION

RECOPILACIÓN DE ANTECEDENTES BACKGROUND COLLECTION

l ua

VIII CONTROL DE DISEÑO CONTROL DESIGN

CRONOGRAMA Y PRESUPUESTO SCHEDULE AND BUDGET

OT RO S

DEFINICIÓN DE VIABILIDAD DE CANT. FEASIBILITY DEFINITION OF QUANTITY

DIS

EÑO

US$ 1.200,0 0

III

DEFINICIÓN DE VARIABLES DEL PROYECTO VARIABLES DEFINING PROJECT

RECONOCIMIENTO DE ETAPAS RECOGNITION STAGES

US$ 5 0.0 0 m en su al

I MARCO TEÓRICO THEORETICAL FRAMEWORK

Valores Hosting: US$ 160.00 Dominio: US$ 50.00 Diseño y posicionamiento: US$ 1.200,00 Mantenimiento, SEO, CM: US$ 50.00

presupuesto

budget

En esta parte veremos algunos detalles de los costos del proyecto como son hosting, dominio y diseño según los requerimientos del cliente, también analizaremos algunos gastos que debió hacer el equipo creativo basado en las horas trabajadas, gastos de transporte, alimentación, consumo de energía eléctrica, etc. Costo del Plan de Hosting sin Dominio Según el peso de nuestro sitio web hemos tomado la decisión de ocupar un plan de 350 Gb según el tamaño de nuestra página, su valor anual es de US$ 160.00 anual el cual incluye un soporte de 50 cuentas de correo, 50 bases de datos MySQL y 100 subdominios. El valor de este plan resulta muy conveniente para el interesado del sitio. ¿Por que tanto espacio de almacenamiento? Porque se va colocar blog que administrara cada uno de las instituciones existente en cada país latinoamericano y conlleva la subida de fotos de los cursos, eventos o seminarios, videos (aunque va estar puestas en las redes Youtube o Vimeo) y otras cosas más, como el blog va estar desarrollado en Wordpress las fotos y videos quedaran dentro del disco duro del hosting y no hay que preocuparse por la falta de espacio. Cada destacar que el hosting tiene de ancho de banda de 3.500 Gb lo que indica que nunca habrá problemas de entradas de usuarios.

350 Gb

US$ 160.00 anual o US$ 13.3 mensual cada uno (por pais)

In this part we will see some details of the project costs such as hosting, domain and design according to customer requirements, also discuss some expenses due to the creative team based on hours worked, costs of transportation, food, electricity consumption , etc. Cost Hosting Plan without Domain Depending on the weight of our website we decided to take a plan of 350 Gb depending on the size of our website, its annual value is US $ 160.00 annually which includes a support 50 email accounts, 50 MySQL databases and 100 subdomains. The value of this plan is very suitable for the recipient site. Why so much storage space? Because it will put blog administer each of the existing institutions in each Latin American country and carries the photo upload courses, events or seminars, videos (though it will you be put on Youtube or Vimeo networks) and other things like the blog will be developed in Wordpress photos and videos remain inside the hard drive hosting and not have to worry about lack of space. Each hosting has noted that the bandwidth of 3.500 Gb indicating that problems will never be user input.

350 Gb

US$ 160.00 annual or US$ 13.3 monthly each (country) 41

UNIDAD Vi UNIT Vi

Costo del Dominio. El valor inicial del dominio es de US$ 50,00 aproximadamente según en cada país ya que como se vio en la UNIDAD I por año. Esta sección hay que conversar muy bien si vamos a unificar los dominios de todas las instituciones de cada país latinoamericano, hay posibilidad de desarrollar un documento legal internacional del cual que Krav Maga Global Headquarters registre que el dominio kravmagaglobal.com y sus posibles extensiones de cada país deba ser certificado y avalado por la entidad sin fines de lucro (ICANN Internet Corporation for Assigned Names and Numbers) Corporación de Internet para la Asignación de Nombres y Números para poder crear una imagen única los dominios web de Krav Maga Global y eso ayudar increíblemente la los posicionamientos en la web de todos los buscadores que existe en la web. Es preferibles que cada uno de los instructores adquieran el dominio con las especificaciones ya conversadas para tener seguridad de que no habra perdida o vencimiento sin previo aviso.

US$ 50.00 aproximadamente anual cada uno (por pais)

presupuesto

budget

Cost Domain. The initial value of the domain is US$ 50.00 approximately as in each country and that as seen in Unit I per year. This section must talk very well if we are to unify the domains of all the institutions of each Latin American country, there is a possibility of developing an international legal document which Krav Maga Global Headquarters to register the domain kravmagaglobal.com and possible extensions of each country should be certified and endorsed by the entity nonprofit (ICANN Internet Corporation for Assigned Names and Numbers) ICANN to create a unique image web domains Krav Global Maga and that help incredibly the positionings in the web of all search engines that exist on the web. It is preferable that each of the instructors acquire the domain specifications already conversed to have assurance that there will be no lost or expire without notice.

US$ 50.00 approximately annual each (country)

presupuesto

budget

Costos de las páginas web de Latinoamérica El costo de cada página web de cada país latinoamericano para crear una imagen única de la institución Krav Maga Global con ciertas variables para que no sea monótono en la diagramación, el mapa de sitio tendrá la misma estructura en todos los aspectos, muy similar a la página principal Krav Maga Global Headquarters, pero el contenido vario dependiente el país y decisión de cada escuela, pero la integración de la imagen va ser la misma. Un ejemplo delo explicamos en la diagramación e imagen es McDonnalds, National Geographic, Krav Maga Worldwide y más, solo entra en Google y coloca dichos nombres y verán los resultados, lo que indica que el éxito de cada una de estas páginas es el posicionamiento por la unificación de un dominio y diagramación única para cada uno.

Costs websites Latin America The cost of each web page of each Latin American country to create a unique image of the institution Krav Global Maga with certain variables to not be monotonous in the layout, the site map will have the same structure in all aspects, very similar to the Home Krav Maga Global Headquarters, but various content dependent on the country and decision of each school, but the integration of the image will be the same. An example model explained in the layout and image is McDonnalds, National Geographic, Krav Maga Worldwide and more, just go to Google and put these names and see the results, indicating that the success of each of these pages is the positioning the unification of a domain and unique for each layout.

Se calcula con todos estos parámetros de diseño, diagramación, programación, retoque y montaje, más las horas-hombre y gastos administrativos da un total de US$ 1.200,00 cada página. Y el costo de mantenimiento, SEO y Community Manager mensual es de US$ 50.00.

It computes the parameters of design, layout, programming, retouching and editing, plus man-hours and administrative costs for a total of US$ 1,200.00 each page. And the cost of maintenance, monthly SEO and Community Manager is US$ 50.00.

Diseño, programación, desarrollo del blog y montaje de la pagina web

Design, programming, blog development and assembly of the website

Mantenimiento, SEO, Community Manager

Maintenance, SEO, Community Manager

US$ 1.200,00 solo una vez US$ 50.00 mensual

US$ 1.200,00 only once US$ 50.00 monthly

CONTROL DE VARIABLES DE SOPORTES

Unit vii

Unidad vii

VARIABLE CONTROL MEDIA

Stands

soportes

En la web encontramos tecnologías muy diversas que emergen, se integran y abandonan que conforman un entorno dinámico que debe ser entendido como tal para tomar decisiones en este ámbito. Estas decisiones requieren un aprendizaje sobre el estado actual de la web y responden a preguntas como ¿De qué forma maximizar la compatibilidad de los distintos navegadores y como los jerarquizamos?, ¿En qué lenguajes será programado el sitio?, ¿Qué Plugins utilizaremos?, ¿Qué programas utilizaremos en su creación? El aumento de la banda ancha y de dispositivos móviles. Google Chrome es el navegador más utilizado de Latinoamerica, superando este año a Internet Explorer y dejando atrás a Mozilla Firefox y juntos acaparan el 95% del mercado por lo que es decisivo lograr una correcta visualización del sitio en estos tres navegadores. La estructura del sitio estará hecha en HTML, utilizando elementos Div, y CSS para estilos. Sobre ella se incorporan recursos tales como: Twitter: Para mantener actualizado minuto a minuto el estado del curso y posibles cambios que se pudiesen generar, este plugin es un JAVASCRIPT (lenguaje que permite crear acciones en la web). Google Calendar: Calendario web a base de iframe (inserción de un documento html dentro de otro principal). Google Calendar se actualiza fácilmente desde la cuenta google del cliente. Google Maps: Objeto iframe, permite ver la ubicación del curso o sedes de Krav maga. Youtube: Videos que se integran en el sitio con un iframe. El proyecto no contempla el uso de flash, por la poca optimización que tiene, el uso de plugins actualizados, poca compatibilidad con dispositivos móviles, no reconocible por la indización de los buscadores puede perjudicar drásticamente el número de visitas. En su defecto se ocuparán tecnologías como javascrip, Spry, jquery y Lightbox.

On the web are very different emerging technologies, integrate and abandon that make a dynamic environment that should be treated as such to make decisions in this area. These decisions require learning about the current state of the site and answer questions like How to maximize the compatibility of different browsers and how we rank ?, What languages will be scheduled site ?, What ?, use Plugins What programs will use in its creation? Increased broadband and mobile devices. Google Chrome is the most used browser in Latin America, surpassing this year’s Internet Explorer and Mozilla Firefox outpacing and together account for 95% of the market so it is critical to ensure proper display of the site these three browsers. The structure of the site will be made in HTML, using Div elements and CSS styles. On it are incorporated resources such as: Twitter: To keep updated minute by minute current status and possible changes that could be generated, this is a JavaScript plugin (language that lets you create shares on the web). Google Calendar: Calendar web based iframe (html inserting a document into another principal). Google Calendar is easily upgraded from google customer’s account. Google Maps: iframe Object allows the location of the course or Krav maga headquarters. Youtube: Videos that are integrated into the site with an iframe. The project does not contemplate the use of flash, little optimization that is, the use of plugins updated, little support for mobile devices, not recognizable by search engines indexing can drastically impair the number of visits. Failing technologies like Javascript,, Spry, jQuery and Lightbox will address. 45

UNIDAD Vii UNIT Vii

Nuestro proyecto pretende usar recursos tecnológicos por los cuáles el usuario pueda visualizar de buena forma en distintas plataformas y navegadores. Un ejemplo sería el uso de Jquery para la galería de imágenes tipo marquesina, en vez de usar Flash, ya que su uso es limitado en algunos navegadores. La idea es que también el usuario pueda acceder al sitio desde su teléfono móvil. Cómo ya habíamos mencionado anteriormente, el propósito de este proyecto es que los usuarios puedan informarse, y no deben existir limitaciones, de ningún tipo. En la parte de formulario de contacto se ha pensado usar PHP y javascript para entregar a los usuarios, mayor interactividad con el sitio, javascript actúa inmediatamente cuando uno o varios campos del formulario no han sido llenados.

Widget de google maps utilizado para dar una referencia gráfica al usuario sobre una dirección. Google maps es un iframe que es insertar un documento html dentro de uno principal. Google maps widget used to give a graphical reference to the user on a direction. Google maps is an iframe that is to insert an html document within one master.

Widget de twitter es un javascript que permite ver las actualizaciones de esta red social en tiempo real, fácilmente actualizable desde dispositivos móviles. Twitter widget is a javascript that lets you see updates of this social network in real time, easily upgradeable mobile devices.

Our project aims to use technological resources for which the user can visualize in good shape on different platforms and browsers. An example would be to use Jquery for marquee gallery-like images, instead of using Flash, as its use is limited in some browsers. The idea is that the user can also access the site from your mobile phone. How can we mentioned above, the purpose of this project is that users can learn, and there should be no limitations whatsoever. In the contact form part of it you have been thought to use PHP and Javascript to deliver to users more interactivity with the site, javascript act immediately when one or more form fields have not been filled.

Google Calendar es un iframe que enlaza a la cuenta de google, fácilmente administrable desde cualquier computador con acceso a internet, permitirá a nuestro cliente actualizar sus clases cuando lo requiera. Google Calendar is a iframe links to google account, easily managed from any computer with internet access will enable our customers to update their classes when required.

Estudio sobre uso y accesibilidad de web de los posibles usuarios de nuestra web. Study on use and accessibility of web of potential users of our website. La siguiente Información es de vital importancia ya que determina que tecnologías vamos a ocupar, que accesibilidad tiene el usuario al medio de internet, que compatibilidad debe tener nuestra página para los distintos navegadores.

35%

Son factores fundamentales para cualquier Diseñador. The following information is vital because it determines which technologies will occupy, which has the user accessibility via the Internet, which must have our support for different browsers.

BANDA ANCHA BROADBAND

They are key factors for any designer.

TOTAL DE HOGARES EN LATINOAMERICA

37%

41%

TOTAL HOUSEHOLD IN LATIN AMERICA

24% 47

CONTROL OF ARCHITECTURE OF INFORMATION

Unit viii

Unidad viii

CONTROL DE LA ARQUITECTURA DE LA INFORMACIÓN

Architecture

Arquitectura

La arquitectura de la información es la disciplina y arte de definir la estructura, organización, navegación, etiquetación e indexación de un sitio web. Es el rol de la arquitectura de la información el decidir cómo se va a estructurar un sitio, que clase de contenido contendrá y como acomodar el crecimiento futuro. Un esquema organizacional que puede tener sentido para una persona, para otra tal vez no lo tenga. En muchos casos el modelo de un sitio web no es capaz de acomodarse a los modelos mentales de los usuarios el tamaño y alcance del sitio mismo. La tarea de la arquitectura de la información es resolver aquellos problemas organizando el sitio de forma efectiva, con vista al objetivo primario. Dado que la AI define la estructura del sitio y básicamente determina su contenido, conviene realizar en las primeras etapas del proyecto. La fase de recopilación de la información entregará las metas y el ámbito. Con esta información se puede crear la estructura del sitio, en forma de mapa del sito o wireframe. Durante el desarrollo visual, la interface es mejor definida y se pueden hacer ajustes a la estructura. Para definir las áreas de contenido, nos hemos basado tanto en los referentes externos, como en un brainstorming sobre lo que los usuarios esperarán de nuestro sitio, haciendo a un lado aquellos contenidos cuya inclusión es impráctica en relación al enfoque de la página.

The information architecture is the discipline and art of defining the structure, organization, navigation, labeling and indexing a website. Is the role of information architecture to decide how it will structure a site, what kind of content will contain and how to accommodate future growth. An organizational scheme that may make sense for a person to another might not have. In many cases the model of a web site is not able to accommodate the user mental models of the size and scope of the site itself. The task of the information architecture is to solve those problems organizing the site effectively, overlooking the primary objective. Since the AI defines the structure of the site and basically determines their content, should be performed in the early stages of the project. The collection phase information will deliver the goals and scope. With this information you can create the site structure, shaped or wireframe site map. During the visual development, the interface is better defined and adjustments can be made to the structure. To define content areas, we have relied both external references, as in a brainstorming on what users expect from our site, putting aside those contents whose inclusion is impractical approach in relation to the page. 49

UNIDAD Viii UNIT Viii

Organizar la información para que pueda ser encontrada fácilmente, clasificándola según un esquema que dependerá de variables como los objetivos del negocio, el tamaño del sitio, su crecimiento futuro y planes de expansión, la audiencia, público objetivo y más. Las secciones del sitio (ejemplo: Home, Instructor, Galerías, Contacto), emergen al agrupar las áreas compiladas en el brainstorming. El etiquetado también debe ser claro y consistente a través del sitio y las etiquetas utilizadas deben poder ser entendidas por el usuario; en vez de “información de contacto”, utilizar sólo “contacto”. En este sentido, implementamos una navegación consistente y persistente, junto con pistas útiles como el mapa del sitio y la creación de links a través del logo para ayudar a mantener al usuario orientado. El sitio desarrollado utiliza una barra de navegación horizontal para los contenidos primarios, y navegación vertical para sub-menús, que sólo muestran páginas pertenecientes a la sección correspondiente.

Organize information so it can be easily found, classifying them according to a scheme that will depend on variables such as business objectives, site size, future growth and expansion plans, the audience, target audience and more. The sections of the site (example: Home, Instructor, Galleries, Contact) emerge compiled by grouping areas in the brainstorming. Labelling should also be clear and consistent throughout the site and the labels used must be able to be understood by the user; instead of “contact”, use only “contact”. In this sense, we implement a consistent and persistent navigation, along with useful clues as the site map and creating links through the logo to help keep the user oriented. The site developed using a horizontal navigation bar for contentprimary, and vertical navigation sub-menus, which show only pages belonging to the relevant section.

INICIO

NOSOTROS • • • • •

Que es Krav Maga El Fundador Instructores Desarrollo del Krav Maga Aprender Krav Maga

START

US • • • • •

What is Krav Maga The founder instructors Development of Krav Maga Learn Krav Maga

PROGRAMA

PROGRAM

• Clasificación en KMG • Krav Maga para protección a terceros • Krav Maga corporativo • Entrenamiento para niños • Krav Maga Civil • Entrenamiento para mujeres • Pasaporte de KMG • Diplomas de KMG • Cursos de KMG Venezuela • Seminarios

• KMG classification • Krav Maga to protect third parties • Krav Maga corporate • Child training • Krav Maga Civil • Training for women • KMG passport • KMG diplomas • KMG courses Venezuela • Seminars

OBJETIVOS KMG

• • • • • • •

Krav Maga para Fuerzas Policiales Krav Maga para Unidades SWAT Krav Maga para Oficiales Air Marshal Krav Maga para Servicios de Inteligencia Krav Maga para El Sector Militar Nuestro Axioma Nuestra Experiencia

Krav Maga for Police Forces Krav Maga for SWAT Units Krav Maga Officer Air Marshal Krav Maga for Intelligence Services Krav Maga for Military Sector Our Axioma Our experience

KMG-BLOG

CONTACTOS

• Localizaciones con sus respectiva dirección y Google Maps • Formulario de correo • Teléfonos • Email (solo escrito) • Horarios • Redes Sociales: Facebook / Twitter / Instagram / Pinterest / Google+

• Locations with their respective direction and Google Maps • Mail form • phones • Email (written only) • Timetable • Social Networks: Facebook / Twitter / Instagram / Pinterest / Google+ 51

UNIDAD Viii UNIT Viii

Nuestro proyecto organiza los contenidos en estilo directorio por el hecho de que para los usuarios es familiar este modo organizacional (que también es usado en supermercados, librerías, tablas de contenido de un libro, etc.), en el que la información en el nivel superior ayuda a intuir como se ven los niveles inferiores. Mientras el visitante sigue los distintos links, la navegación de la página principal permanece constante. Los menús y submenús no debieran estar atestado con elementos que no describen las principales áreas de contenido; se deben excluir links externos, contenido descargable o direcciones e-mail. Por el tamaño del sitio, consideramos que un sistema de búsqueda no era necesario; en el caso del blog si colocaremos un sistema de búsqueda ya que va ser el módulo de mayor cantidad de actualizaciones en modo de noticias, adelantos, etc. En la sección de contactos colocaremos un sub-módulo de redes sociales en el cual colocaremos los widgets que podrá el usuario interactuar directamente desde la página, Facebook, Twitter, Instagram y demás. Creando así mas vínculo con la página de la institución.

Our project organizes the content directory style by the fact that users are familiar with this organizational mode (which is also used in supermarkets, bookstores, tables of contents of a book, etc.), in which information on the level above helps intuit as the lower levels are. While visitors follow the various links, navigation of the homepage remains constant. The menus and submenus should not be cluttered with items not describe the major content areas; to exclude external links, downloadable content or e-mail addresses. By the size of the site, we believe that a search was not necessary; in the case of the blog if you place a search system as it will be the module as much as news updates, advances, etc. In the contact section place a sub-module of social networks in which we will place the widgets that the user can interact directly from the page, Facebook, Twitter, Instagram and others. thus creating more link to the page of the institution.

CONTROL DE DISEﾃ前

Unit ix

Unidad ix

CONTROL OF DESIGN

Luego de definir el cronograma de tiempos, se definió un árbol de navegación donde se organizó la información, se buscaron referentes, y se generara una retroalimentación entre el cliente y nosotros donde compartiremos ideas y que se podía aplicar a la página, se diseñó la página Krav Maga Global Venezuela como punto de referencia de diseño y diagramación, tendrá modo parallax de inicio y el resto de la página como diseño normal, donde se estableció las tecnologías a aplicar, una vez realizado esto se presentó al cliente, estas fueron muy bien aceptadas.

DESIGN

DISEÑO

En el diseño de la página se utilizaron imágenes y textos proporcionados por el cliente, se tuvo por parte nuestra optimizar las imágenes para web a 144dpi, para el diseño se tomó especial cuidado en seleccionar tipografía de uso gratuito personal y comercial, también de que la tipografía a ocupar en los desarrollos fuese posible ver desde cualquier dispositivo.

After defining the schedule time, a navigation tree where information is organized defined, were sought referents, and feedback between the client generate and us where we will share ideas and that could be applied to the page, the page is designed Krav Maga Global Venezuela as a benchmark for design and layout, will parallax start and the rest of the page as a normal design, where technologies was established to implement, once done this was presented to the client, these were very well accepted mode . In the design of the page images and texts provided by the client were used, he had by us optimize images for web to 144dpi, for design special care was taken in selecting typography free to use personal and business, also that the typography to fill in the developments possible to see from any device.

UNIDAD Viii UNIT Viii

Es importante destacar que la utilización de widgets poderosos podemos hacer fondo de videos para apreciar más la estética de la página, pero solo lo usamos en sitios que mayor atraiga al usuario como por ejemplo inicio, instructores y cursos, los videos va ser modo streaming pero si la persona visita la web en móviles carecerá de ese punto.

Hoy en día las paginas tiene mucha imagen y poco texto y es importante la utilización de fotografías hecha profesionalmente ya que las competencias como la página de Krav Maga Los Ángeles o Krav Maga Worldwide utilizan mucho ese punto, las fotografía es un medio fundamental en el desarrollo de este proyecto por ello se necesita que cada uno de las instituciones de cada país tengan que trabajar en hacer fotografías y videos reel profesionales para dar imagen propia de cada uno de ellos.

Importantly, the use of powerful widgets can do background video to appreciate the aesthetics of the page again, but only used it in places that most attract the user such as start, instructors and courses, the videos will be way streaming but if the person visits the web on mobile will lack that point.

Today the pages have a lot of image and some text and it is important to use photographs professionally done as competencies as page Krav Maga Los Angeles or Krav Maga Worldwide use that point a lot, photography is a fundamental means in development this project therefore needed that each of the institutions in each country have to work on making photographs and videos professional reel to give self-image of each of them.

UNIDAD Viii UNIT Viii

closure

CONCLUSION

Luego de dos semanas de investigación y diseños realizamos el presente informe analizamos desde lo más básico para poner en pie el proyecto web hasta el diseño de las gráficas estáticas que luego serán presentadas a nuestro cliente, entregando la comunicación que el desea con sus usuarios. El ejemplo de diseño web como prototipo lo tenemos en www.kravmagaglobal.com/parallax.html. El nuevo diseño de las páginas web Krav Maga Global Latinoamérica dará una nueva imagen de esta gran organización, queremos servirle a Eyal Yanilov que nosotros podemos mostrar una imagen de Krav Maga Latinoamérica más serio, ordenado y sobre todos actual en materia de páginas web. También queremos ofrecer que los servicios de SEO sea los más eficientes y completos, garantizando así la eficiencia de los posicionamientos de cada uno globalmente en internet.

LUEGO de Dos Semanas de Investigación Y Diseños REALIZAMOS El Presente report from analizamos Lo Más Básico para Poner En Pie El Proyecto Web Hasta el diseño de las Gráficas Estáticas Que LUEGO seran presentadas a Nuestro Cliente, entregando la Comunicación Que El DESEA con SUS Usuarios. El Ejemplo de Diseño Web Como TENEMOS ES prototipo del lo www.kravmagaglobal.com/parallax.html. El nuevo diseño de las paginas web Krav Maga Global Latinoamérica Dara Una Nueva Imagen de Gran this organization, Queremos servirle un Eyal Yanilov Que Nosotros Podemos Mostrar Una imagen de Krav Maga Latinoamérica Más serio, ordenado y en Sobre la materia de páginas web real todos. Queremos ofrecer también Que los Servicios de SEO mar Los Mas Eficientes y completos, garantizando Así la Eficiencia de los posicionamientos de Cada Uno globalmente en internet.

Krav Maga Global Venezuela Instructor: Tito Pomenta

J.Girón [Fotografía & Diseño] Jainner Jesús Girón Lamus www.JGiron.photo info@JGiron.photo / girondesign@gmail.com