Lineamientos de desarrollo de la marca de Google Classroom

En este documento, se describe cómo usar el nombre, el logotipo y el ícono de Google Classroom. Si tienes más preguntas, consulta los permisos de marca de Google más generales.

Lineamientos para el uso de íconos

Cuando realices la integración con Classroom, usa siempre el ícono de Classroom (en lugar del logotipo de Google). Asegúrate de que el ícono de Google Classroom se vea por completo y con claridad. Puedes usar el ícono con el texto “Google Classroom” o sin él. Si usas el ícono de Classroom junto con otros logotipos, asegúrate de que cada uno tenga el espaciado adecuado para que se pueda leer.

Tamaños

El ícono de Classroom está disponible en varios tamaños, de 32 a 96 píxeles. Puedes escalar el ícono para diferentes dispositivos y tamaños de pantalla, pero debes conservar la relación de aspecto para que el logotipo no se deforme.

Logotipos cuadrados de Classroom

Descarga logotipos cuadrados

Logotipos redondos de Classroom

Descarga logotipos redondos

Describe Classroom

Cuando uses el ícono de Classroom, puedes incluir el nombre completo "Google Classroom" o la versión abreviada "Classroom".

Botones de ejemplo:

Ejemplos de botones

Ejemplo de padding:

Ejemplo de padding

Cuando hables sobre las clases de Classroom, usa una de estas frases (ten en cuenta que "classes" no lleva mayúsculas):

  • Clases de Google Classroom (por ejemplo, "Elige entre tus clases de Google Classroom")
  • Clases de Classroom (por ejemplo, “Elige entre tus clases de Classroom”)
  • Invitar a través de Google Classroom
  • Cómo compartir con Google Classroom
  • Compartir con Google Classroom

No uses las siguientes frases:

  • Google Classrooms
  • Clases de Google
  • Google Classes
  • Clase de Google
  • Cómo invitar a Google Classroom

Cómo describir tu propio producto o aplicación

Si tu producto es compatible con Google Classroom, haz referencia a esta plataforma con el texto "para", "para usar con" o "compatible con", y asegúrate de incluir el símbolo ™ con la marca de Google. Ejemplo: "para Google Classroom™"

Ejemplo de logotipo

Si haces referencia a una marca comercial de Google en combinación con tu logotipo, el texto de referencia debe ser más pequeño que el logotipo.

Ejemplo de logotipo

Cómo usar capturas de pantalla

Para fines ilustrativos o informativos, puedes usar capturas de pantalla estándar y sin alterar de los servicios de Google. Para obtener más detalles, consulta los Permisos de marca de Google generales.

Atribución adecuada

Proporciona la atribución adecuada a Google por cualquier uso de sus marcas en el título o la descripción de tu aplicación. Ejemplo: Google Classroom es una marca de Google Inc. El uso de esta marca está sujeto a los Permisos de marca de Google.

Fuente

Usa Roboto Bold, una fuente TrueType.

Para instalarla, descarga la fuente Roboto y descomprime el paquete de descarga.

  • En Mac, haz doble clic en Roboto-Bold.ttf y, luego, en "Instalar fuente".
  • En Windows, arrastra el archivo a "Mi computadora" > "Windows" > carpeta "Fuentes".

Colores

Ejemplo de íconos y colores

  • Ícono clásico
    • El color verde del ícono de Google Classroom es #25A667.
    • El color amarillo del ícono de Google Classroom es #F6BB18.
    • El color blanco del ícono de Google Classroom es #FFFFFF.
    • El color secundario verde de la persona de la izquierda y la derecha en el ícono de Google Classroom es #57BB8A.
  • Ícono oscuro
    • El color negro del ícono de Google Classroom es #000000.
    • El color blanco del ícono de Google Classroom es #FFFFFF.
    • El color secundario gris de la persona de la izquierda y la derecha en el ícono de Google Classroom es #57BB8A.
  • Ícono de luz
    • El color verde del ícono de Google Classroom es #25A667.
    • El color amarillo del ícono de Google Classroom es #F6BB18.
    • El color secundario verde de la persona de la izquierda y la derecha en el ícono de Google Classroom es #57BB8A.

Estado de desplazamiento del cursor

Cuando se coloca el cursor sobre el ícono, este debe tener un 20% de sombra negra.

Ejemplo de estados de desplazamiento del mouse

Diseño de logotipo incorrecto

  • No uses colores distintos de los dos especificados para el ícono.
  • No uses un ícono de Google para representar Google Classroom.
  • No crees tu propio ícono para el botón.
  • No uses el término "Google" aislado, sin el ícono de Google Classroom.
  • Ejemplos de diseños de botones incorrectos de Google Classroom:

Ejemplos de uso incorrecto

Nunca uses el logotipo de Google a color en el botón. Siempre incluye el ícono de Google Classroom a la izquierda del botón. No cambies la fuente del botón.