Giter VIP home page Giter VIP logo

pictogramas's Introduction

Pictogramas

Pictogramas es una librería gráfica modular para la composición de pictogramas. El foco central de esta librería es promover y facilitar la accesibilidad cognitiva en las transacciones de los servicios públicos. Esta librería es el componente central de PICTOS una aplicación gratuita para hacer los servicios más accesibles.

Este es un proyecto de bien público y de código abierto. Por favor ayúdanos a mantenerlo con tu donación. Donate using Liberapay

Sistema gráfico

Este sistema permite crear Pictogramas a partir de la articulación de 3 elementos o capas gráficas. Este pictograma ilustra el paso, de una serie de pasos que constituyen una tarea. PICTOS ayuda a volver más accesibles las tareas de los servicios públicos, sus transacciones.

Las capas de cada paso o pictograma:

  1. Capa superior: Acciones del protagonista: verbo
  2. Capa media: Artefactos y elementos: objeto sustantivo con el cual se interactúa
  3. Capa contextual: Espacio y referentes: razgo icónico en su sentido tipológico-situacional

El sistema gráfico permite crear apoyos visuales y procedimentales compuestos por:

  1. Un pictograma compuesto, as su vez, por 3 capas: acción del protagonista, artefactos o elementos de interacción y espacio y contexto.
  2. Una instrucción compuesta por un ícono que refuerza la acción y una frase en lectura fácil o lenguaje llano

Para la construcción correcta de un apoyo visual consistente debe existir una estrecha relación sintáctica entre la instrucción y el pictograma, cosa de establecer una clara correspondencia entre los elementos de la instrucción y los elementos gráficos que la acompañan.

Este sistema permite crear Pictogramas a partir de la articulación de 3 elementos o capas gráficas. Este pictograma ilustra el paso, de una serie de pasos que constituyen una tarea. PICTOS ayuda a volver más accesibles las tareas de los servicios públicos, sus transacciones.

Este sistema contiene una colección de posibilidades para cada una de las capas, lo que permite una combinatoria muy amplia de pictogramas que buscamos aumentar gracias al apoyo de la comunidad.

Estructura

{
    "title": "Pictogramas",
    "description": "Librería gráfica modular para la composición de pictogramas enfocados en la accesibilidad cognitiva",
    "properties": {
        "pictos": [
            {
                "layer": 1,
                "path": "1-subject/ease.svg",
                "label": "Parado",
                "category": ["Trámites","Salud","Transporte","Ocio"],
                "tags": [ "mirar", "esperar", "escuchar","quieto","de pie"]
            },
            {
                "layer": 1,
                "path": "1-subject/push.svg",
                "label": "Presiona",
                "category": ["Trámites","Salud","Transporte","Ocio"],
                "tags": [ "Apretar botón", "Deslizar ticket", "Tomar ticket", "Presionar"]
            },
            ...
  1. Layer: Indica el orden en el que se apilan las capas, 1 siendo la que va por encima de todas las demas.
  2. Path: Direccion del archivo svg.
  3. Label: Nombre con el que se encuntra cada pictograma en la lista.
  4. Category: Indica el servicio en el que cada pictograma se puede usar, para filtrar por servicio especifico y recibir solo los pictogras que tienen utilidad en este.
  5. Tags: Otras formas de llamar a un pictogramas, para facilitar la busqueda de estos.

Créditos

Este proyecto es fruto del trabajo de muchas personas y el apoyo de diversas iniciativas:

Autores

Pictogramas (inicialmente "PICTOS") fue el proyecto de Titulación de Diseño Gráfico de Antonella Pastén y María Ignacia von Unger. Profesores Herbert Spencer, Katherine Exss y Vanessa Vega. e[ad] Escuela de Arquitectura y Diseño PUCV. Este proyecto sigue en crecimiento y es mantenido por el Núcleo de Investigación en Accesibilidad e Inclusión PUCV.

Instituciones

  1. Pontificia Universidad Católica de Valparaíso mediante los proyectos:
  • I2: Investigación Inclusiva: Oportunidades para fortalecer la autodeterminación en la era digital (2017)
  • I3: Investigación, Innovación e Inclusión en la PUCV (2018)
  1. Servicio Nacional de la Discapacidad, SENADIS
  • Apoyos Visuales para la Plena Inclusión de las Personas con Discapacidad Intelectual en los Servicios Públicos en Chile (2019-2020)
  1. Agencia Nacional de Investigación y Desarrollo, ANID
  • PICTOS: Servicio para la navegación y evaluación de la accesibilidad cognitiva de los servicios en Chile IT21|0065 (2022-2024)
Agencia Nacional de Investigación y Desarrollo Pontificia Universidad Caólica de Valparaíso SENADIS Cultura Libre Código Abierto

Licencia

Pontificia Universidad Católica de Valparaíso

CC BY-SA-NC

:)

pictogramas's People

Contributors

antopasten avatar basilio avatar felipelavinz avatar hspencer avatar jacodiego avatar mvonunger avatar omarogd1 avatar reneerodo avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

Forkers

antopasten

pictogramas's Issues

Relase nueva versión de pictogramas

Hola @reneerodo @hspencer

para completar el paso a producción de los nuevos pictogramas, necesitamos su ayuda con:

cc @antopasten @jacodiego @pedroarellano

Añadir definiciones para publicación como paquete

Añadir las definiciones para publicación como paquete de npm/yarn (javascript) y packagist (php). Podríamos establecer como issues del repositorio la posibilidad de añadir nuevos gestores de paquetes y pedir colaboración con quienes tengan experiencia en esos lenguajes (ruby, python, .net, etc)

Definición de paquete con propiedades

Por cada idioma en que se disponibilizará, crear un JSON con las descripciones y traducciones de cada ícono, p. ej:

[
  {
    "layer": 1,
    "path": "1-actions/wait.svg",
    "label": "Person waiting"
  }
]

Mejoras de organización del repositorio

Hola @hspencer

Actualmente hay varias ramas activas en el repositorio, en especial "master" y "gh-pages"; esta última se está utilizando fundamentalmente para construir la visualización web que está en https://accesibilidad-inclusion.github.io/pictogramas/

Propongo integrar gh-pages a master y construir la visualización web directamente desde master, de modo de reducir la complejidad de administración del repo.

Adicionalmente, al hacer el merge podemos usar la opción "squash commits" para integrar todos los cambios en un solo commit y asi evitar "inflar" el peso del repositorio con los archivos binarios que en algún punto estaban versionados.

Con respecto a los archivos de Illustrator, identifico básicamente tres opciones:

  1. Utilizar "Large file storage" - al parecer se podría integrar de forma transparente en el repositorio, pero tiene un límite gratuito bastante limitado. Se puede pagar para elevar ese límite.
  2. Incorporarlos como otro repositorio, que podría estar hosteado en el servidor de la e[ad] - sería más complejo de administrar, pero podríamos tener más control en cuanto al uso de espacio. También sería más complejo manejar los aportes a los archivos Illustrator.
  3. Dejar de utilizar archivos de Illustrator y en su lugar usar únicamente SVG. Esto sería por lejos la mejor opción en cuanto a facilidad de integrar en el repo, incluir nuevas contribuciones, etc.

Espero tus comentarios,
saludos!

Sitio web (gh-pages)

Habilitar un sitio sencillo con github pages que permita explicitar los procesos técnicos y de diseño para poder contribuir al proyecto

Normar y homologar archivo descriptivo manifest.json

  • Estructura de archivo manifest.json no está acorde a estructura planteada en documentación, se debe actualizar lo que corresponda
  • Incluir definiciones sobre cada propiedad utilizada para describir los pictogramas
  • En propiedades "category" y "tags" de cada pictograma, se debe usar lenguaje natural ("Trámites" en lugar de "tramites")
  • Corregir errores ortográficos en propiedades "label", p.ej "Modulo de servicio" → "Módulo de servicio"
  • Se podría añadir un campo "description" que sea complementario al de "label", que permita un texto más extenso

Homologar y corregir nombres de archivos

Actualmente los nombres de archivos no están definidos de forma uniforme, p.ej: registro-civil-2.svg, sign-center-left--seat.svg

Se debería definir una convención de nombres y aplicarla consistentemente en todos los archivos.

Se propone como convención: {$titulo}--{$variante}.svg o simplemente

  • sin utilización de caracteres especiales
  • utilizar guión medio ("-") como separador de palabras
  • utilizar doble guión medio ("--") para identificar variables
  • utilizando el mismo idioma para nombrar todos los archivos

Herramienta de exportación

Crear una herramienta por línea de comandos para exportar por capas, todas las combinaciones, o una combinación específica a PNG u otros formatos de imagen

correcciones a archivos exportados en capa 3-context

las imágenes svg exportadas desde el illustrator deben estar circunscritas al mismo canvas en que se ubican las restantes capas, es decir, deben quedar bien posicionadas con respecto a éstas al superponerlas

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.