Ir al contenido

Sistema de diseño

Guiding Business

  • Versión3
  • AlcanceMarca
  • Fecha2026-11-04
  • Pertenece aThe Beacon Holding
  • OrigenOdoo, versión publicada
01

Identidad

Propósito, misión, visión y valores

Guiding Business

Eslogan

Misión

Singular Beacon, S.L. tiene como misión ayudar a sus clientes a desarrollar su máximo potencial digital gracias a un ecosistema de servicios y soluciones que simplifican la gestión, optimizan procesos y ayudan a tomar decisiones mejor informadas.

Texto institucional

  • [Singular Beacon, S.L. tiene] por objeto la prestación de servicios de asesoría, consultoría, comercialización, integración, desarrollo, implementación, mantenimiento y soporte de soluciones digitales.
  • Nos apasiona unir la tecnología y las ideas para crear soluciones digitales que impulsen el crecimiento y la innovación.
  • Implantación de Odoo (ERP, CRM, proyectos, RR. HH., contabilidad) de principio a fin; data, analytics, BI e IA; digitalización de procesos; formación con The Singular Academy; Kit Digital y Kit Consulting (Acelera Pyme).
  • Martínez Villergas 49 V-1º, 28027 Madrid. España. [email protected]
  • www.singularbeacon.com; la sociedad, Singular Beacon, S.L., en singularbeacon.sl.
  • Esto incluye pero no se limita a: - Inteligencia de Negocio y Analítica Avanzada: Consultoría de Gestión Empresarial, Procesos de Extracción y Transformación de datos (ETL), Desarrollo de Informes, Cuadros de Mando, Modelos Analíticos y Algoritmos mediante técnicas de Big Data, Machine Learning e Inteligencia Artificial. - Soluciones Digital y Cloud: Soluciones Corporativas y Ofimática, Sistemas de Gestión Corporativo y Comercial (ERP y CRM), Software Especializado, Dominios, Infraestructura Digital y Computación en la Nube (Cloud) tanto de desarrollo propio como de terceros. - Ciberseguridad y Cumplimiento Normativo (compliance): Evaluación de Riesgos, Análisis de Vulnerabilidades (PenTesting), Certificaciones de Seguridad Informática, Análisis Forense Digital (Forensics) y Protección de Datos. - Marketing y Comunicación: Estrategia Digital, Publicidad Digital (SEM), Optimización en Buscadores (SEO), Gestión de Redes Sociales (Community Management) y Desarrollo de Contenido (Copywriting) - Diseño Gráfico, Experiencia de Usuario (UX) e Interfaces (UI): Desarrollo de identidad corporativa y activos digitales tales como logotipos, videos, iconos, imágenes plantillas e interfaces web o de aplicaciones.
Lo que hereda Heredado de The Beacon Holding

Propósito

El grupo es la forma de crear un impacto positivo en el mundo

Heredado de The Beacon Holding

Pilares

Heredado de The Beacon Holding

  • Datos para decidir
  • Personas en el centro
  • Tecnología como medio
  • Gestión por proyectos, con márgenes unitarios
  • Los valores, la visión y la ética profesional que nos guían

Valores

Heredado de The Beacon Holding

Impacto Positivo

Actuamos conforme a nuestros valores y nuestro Código Ético, tratamos de forma respetuosa y agradable a todas las partes, tenemos conciencia social y ambiental y una clara determinación de aportar valor construyendo relaciones que cuidamos en el largo plazo.

Bondad, Honestidad, Lealtad y Respeto

Aporte de Valor

Ofrecemos soluciones de alta calidad y trabajamos para que cada euro invertido por nuestros clientes se transforme en valor para su firma. Nos responsabilizamos del ciclo de vida completo de los proyectos operando conforme a los principios de eficiencia y eficacia, comenzando con el final en mente y buscando sinergias y estrategias win-win.

Vocación de Excelencia y Orientación a Resultados

Adaptabilidad

Nuestro sector, así como las necesidades de nuestros clientes están en constante cambio. Somos conscientes, considerados y comprensivos con estas necesidades. Tenemos voluntad de ayudar y lo hacemos siendo flexibles en cuanto a cambios en los requisitos iniciales, plazos y costes.

Flexibilidad, Empatía y Transparencia

Texto institucional 1
  • Digital Branding (Londres, 2015: origen del grupo, no es división)
02

Logotipo

Variantes, área de respeto y usos

Variantes

Área de respeto

Área de respeto
Margen libre en los cuatro lados: 12 % de la altura del logotipo

Usos prohibidos

Así noLos logotipos solo deben usarse en los colores proporcionados.
Así noEl faro y el lema «Guiding Business» no se redibujan, no se recolorean, no se generan.
  • No recrees el logotipo desde cero, utiliza estos.

03

Color

Rampas, roles y contrastes

Rampas

Primario

900 #001C35
800 #00355D
700 #005189
Color de origen #006EB7 Azul principal de la marca; botones primarios y enlaces sobre fondo claro.
500 #3B85C6
400 #609CD4
300 #82B3E2
200 #A3CAF0
100 #C5E2FE
50 #F0F8FF

Marino

900 #041D2A
Secundario #003E58 Marino; texto del logotipo, titulares destacados y fondo oscuro de panel.
700 #25536C
600 #416980
500 #5C8094
400 #7897A9
300 #94AFBE
200 #B1C7D4
100 #CFE0EA
50 #EEF9FF

Neutro

Oscuro #0E0E0E Negro de marca; texto principal sobre claro y fondo del tema oscuro.
800 #242423
Gris oscuro #3C3C3B Gris oscuro (propuesta, de KB 14); texto secundario sobre claro.
600 #595958
500 #777776
400 #979796
300 #B8B8B8
Gris claro #DADADA Gris claro (propuesta, de KB 14); texto secundario sobre oscuro y filetes.
100 #E7E7E7
Claro #F4F4F4 Blanco roto; fondo de página claro y texto sobre oscuro.

Acento

900 #370600
800 #671400
700 #9A2503
Color de origen #CD3E19 Naranja de acento (propuesta, de KB 14); rellenos y acentos, no texto sobre claro (4,44 : 1).
500 #DB6042
400 #E87D64
300 #F49A84
200 #FFB6A4
100 #FFD6CB
50 #FFF4F1

Paleta

Blanco #FFFFFF RGB 255, 255, 255 Blanco; superficie de tarjeta clara y detalle de iconos.
Cielo #8FD3FF RGB 143, 211, 255 Cielo; azul claro para enlaces, foco y primario en tema oscuro.
Ambar #FF9A62 RGB 255, 154, 98 Ámbar de la web; decoración, no texto.
Noche #021620 RGB 2, 22, 32 Noche de la web; fondos muy oscuros de cabecera.
Tinta #05283A RGB 5, 40, 58 Tinta de la web; degradado bajo texto sobre foto y sombras.
Solape #56ABE2 RGB 86, 171, 226 Solape por transparencia de los iconos de app (0,6 × #8FD3FF + 0,4 × #006EB7).
Fondo oscuro #262A36 RGB 38, 42, 54 Fondo oscuro de la hoja de contacto de iconos.
Sombra #02161F RGB 2, 22, 31 Sombras del duotono de foto (tratamiento en revisión).
Medio #006088 RGB 0, 96, 136 Medios tonos del duotono de foto (tratamiento en revisión).
Luz #E2EEF4 RGB 226, 238, 244 Luces del duotono de foto (tratamiento en revisión).
Claro #00672C RGB 0, 103, 44
Claro #6D5000 RGB 109, 80, 0
Oscuro #7CD591 RGB 124, 213, 145
Oscuro #E1B75C RGB 225, 183, 92

Roles

Claro

  • Fondo #F4F4F4
  • Superficie #FFFFFF
  • Superficie alta #F0F8FF
  • Tinta #0E0E0E
  • Tinta suave #3C3C3B
  • Tinta sobre primario #F4F4F4
  • Primario #006EB7
  • Primario hover #003E58
  • Acento #CD3E19
  • Borde #777776
  • Foco #003E58
  • Exito #00672C
  • Aviso #6D5000
  • Error #9A2503
  • Enlace #006EB7

Oscuro

  • Fondo #0E0E0E
  • Superficie #242423
  • Superficie alta #003E58
  • Tinta #F4F4F4
  • Tinta suave #DADADA
  • Tinta sobre primario #0E0E0E
  • Primario #8FD3FF
  • Primario hover #609CD4
  • Acento #CD3E19
  • Borde #777776
  • Foco #8FD3FF
  • Exito #7CD591
  • Aviso #E1B75C
  • Error #F49A84
  • Enlace #8FD3FF

Contrastes

Aa

secundario / claro

10.43:1 AAA

Aa

primario / claro

4.87:1 AA

Aa

claro / primario

4.87:1 AA

Aa

oscuro / claro

17.55:1 AAA

Aa

claro / oscuro

17.55:1 AAA

Aa

claro / secundario

10.43:1 AAA

Aa

tinta / fondo

17.55:1 AAA

Aa

tinta / superficie

19.30:1 AAA

Aa

tinta / superficie-alta

17.99:1 AAA

Aa

tinta-suave / fondo

10.04:1 AAA

Aa

tinta-suave / superficie

11.04:1 AAA

Aa

tinta-suave / superficie-alta

10.29:1 AAA

Aa

enlace / fondo

4.87:1 AA

Aa

enlace / superficie

5.36:1 AA

Aa

enlace / superficie-alta

5.00:1 AA

Aa

tinta-sobre-primario / primario

4.87:1 AA

Aa

tinta-sobre-primario / primario-hover

10.43:1 AAA

Aa

exito / fondo

6.41:1 AA

Aa

exito / superficie

7.05:1 AAA

Aa

exito / superficie-alta

6.57:1 AA

Aa

aviso / fondo

6.82:1 AA

Aa

aviso / superficie

7.50:1 AAA

Aa

aviso / superficie-alta

6.99:1 AA

Aa

error / fondo

7.23:1 AAA

Aa

error / superficie

7.95:1 AAA

Aa

error / superficie-alta

7.41:1 AAA

Aa

primario / fondo

4.87:1 AA

Aa

primario / superficie

5.36:1 AA

acento / fondo

4.44:1 AA, solo texto grande

Aa

acento / superficie

4.88:1 AA

borde / fondo

4.07:1 AA, solo texto grande

borde / superficie

4.48:1 AA, solo texto grande

Aa

foco / fondo

10.43:1 AAA

Aa

foco / superficie

11.47:1 AAA

Aa

foco / superficie-alta

10.69:1 AAA

Aa

tinta / fondo

17.55:1 AAA

Aa

tinta / superficie

14.12:1 AAA

Aa

tinta / superficie-alta

10.43:1 AAA

Aa

tinta-suave / fondo

13.80:1 AAA

Aa

tinta-suave / superficie

11.11:1 AAA

Aa

tinta-suave / superficie-alta

8.20:1 AAA

Aa

enlace / fondo

11.88:1 AAA

Aa

enlace / superficie

9.56:1 AAA

Aa

enlace / superficie-alta

7.06:1 AAA

Aa

tinta-sobre-primario / primario

11.88:1 AAA

Aa

tinta-sobre-primario / primario-hover

6.62:1 AA

Aa

exito / fondo

10.83:1 AAA

Aa

exito / superficie

8.71:1 AAA

Aa

exito / superficie-alta

6.43:1 AA

Aa

aviso / fondo

10.23:1 AAA

Aa

aviso / superficie

8.23:1 AAA

Aa

aviso / superficie-alta

6.08:1 AA

Aa

error / fondo

9.01:1 AAA

Aa

error / superficie

7.25:1 AAA

Aa

error / superficie-alta

5.35:1 AA

Aa

primario / fondo

11.88:1 AAA

Aa

primario / superficie

9.56:1 AAA

acento / fondo

3.95:1 AA, solo texto grande

acento / superficie

3.18:1 AA, solo texto grande

borde / fondo

4.30:1 AA, solo texto grande

borde / superficie

3.46:1 AA, solo texto grande

Aa

foco / fondo

11.88:1 AAA

Aa

foco / superficie

9.56:1 AAA

Aa

foco / superficie-alta

7.06:1 AAA

Aa

claro / primario

4.87:1 AA

Aa

claro / oscuro

17.55:1 AAA

Aa

claro / secundario

10.43:1 AAA

primario / oscuro

3.59:1 AA, solo texto grande

acento / claro

4.44:1 AA, solo texto grande

Aa

acento / blanco

4.88:1 AA

Aa

blanco / acento

4.88:1 AA

claro / acento

4.44:1 AA, solo texto grande

oscuro / acento

3.95:1 AA, solo texto grande

Aa

cielo / oscuro

11.88:1 AAA

Aa

cielo / secundario

7.06:1 AAA

Aa

gris-oscuro / claro

10.04:1 AAA

Aa

gris-claro / oscuro

13.80:1 AAA

Aa

primario / blanco

5.36:1 AA

tinta-sobre-primario / acento

4.44:1 AA, solo texto grande

tinta-sobre-primario / acento

3.95:1 AA, solo texto grande

Combinaciones prohibidas

primario / secundario

2.13:1 No usar

secundario / oscuro

1.68:1 No usar

acento / superficie-alta

2.34:1 No usar

  • No usar #006EB7 sobre #003E58: contraste 2.13:1, por debajo de AA.

  • No usar #003E58 sobre #0E0E0E: contraste 1.68:1, por debajo de AA.

  • No usar #006EB7 sobre #0E0E0E: contraste 3.59:1, por debajo de AA.

04

Tipografía

Familias, especímenes y escala

Familias

Open Sans

Primaria

Guiding Business

400700

Assistant

Secundaria

Singular Beacon

Arial

Terciaria

Guiding Business

400700

Estilos

Título display 61px · 700 · 1.11 Títulos

Guiding Business

Título 1 49px · 700 · 1.14 Título de página o de sección

Singular Beacon

Título 2 39px · 700 · 1.23 Subtítulo y título de tarjeta

Guiding Business

Título 3 31px · 700 · 1.29 Título menor dentro de un bloque

Singular Beacon

Título 4 25px · 700 · 1.28 Títulos

Guiding Business

Título 5 20px · 700 · 1.4 Títulos

Singular Beacon

Cuerpo 16px · 400 · 1.5 Texto corrido de la interfaz

Guiding Business

Cuerpo fuerte 16px · 700 · 1.5 Texto corrido de la interfaz

Singular Beacon

Cuerpo pequeño 14px · 400 · 1.43 Texto corrido de la interfaz

Guiding Business

Etiqueta 12px · 400 · 1.33 Antetítulos, etiquetas y metadatos

Singular Beacon

Impreso tarjeta nombre 9.1pt

Guiding Business

Impreso tarjeta contacto 6.5pt

Singular Beacon

05

Espaciado y forma

Escala, radios y elevación

Radios

00px
22px
44px
Circulo50%

Elevación

1 0 1px 2px rgba(5,40,58,0.08)
2 0 4px 12px rgba(5,40,58,0.12)
3 0 12px 32px rgba(5,40,58,0.18)

Sobre superficie clara, para que la sombra se vea en cualquier tema.

06

Componentes

Piezas web estándar del grupo

Botón

Un solo botón principal por vista; lo demás, secundario o fantasma.

Variantes, estados y código

La acción de una vista.

Variantes

Secundario
Fantasma

Estados

Normal
Encima
Activo
Deshabilitado

Regla de uso Un solo botón principal por vista; lo demás, secundario o fantasma.

Código
<button type="button" class="bb-c-button bb-c-button--primario">Contactar</button>

Tarjeta

Una idea por tarjeta, y todas las de una fila del mismo alto.

Variantes, estados y código

Un contenido con título, texto y enlace.

Variantes

Borde
Acento

Estados

Normal
Encima

Regla de uso Una idea por tarjeta, y todas las de una fila del mismo alto.

Código
<article class="bb-c-card bb-c-card--superficie">
                <p class="bb-c-card__over">Marca</p>
                <h3 class="bb-c-card__title">Guiding Business</h3>
                <p class="bb-c-card__text">Guiding Business</p>
                <a class="bb-c-card__link" href="#">Seguir leyendo</a>
        </article>

Cabecera de página

Marca

Singular Beacon

Guiding Business

Un solo título principal por página, que diga de qué va en una línea.

Variantes, estados y código

La apertura de una página: antetítulo, título y entradilla.

Variantes

Marca

Singular Beacon

Guiding Business

Acento

Regla de uso Un solo título principal por página, que diga de qué va en una línea.

Código
<header class="bb-c-header bb-c-header--superficie">
            <p class="bb-c-header__over">Marca</p>
            <h1 class="bb-c-header__title">Singular Beacon</h1>
            <p class="bb-c-header__lede">Guiding Business</p>
        </header>

Llamada a la acción

Una por página, al final, con un verbo que diga qué pasa al pulsar.

Variantes, estados y código

El cierre de una página, con una sola acción.

Variantes

Superficie

Regla de uso Una por página, al final, con un verbo que diga qué pasa al pulsar.

Código
<aside class="bb-c-cta bb-c-cta--acento">
            <h2 class="bb-c-cta__title">Guiding Business</h2>
            <a class="bb-c-button bb-c-button--primario" href="#">Contactar</a>
        </aside>

Cita

Guiding Business

Singular Beacon

Siempre con autoría; si no se puede atribuir, no es una cita.

Variantes, estados y código

Una frase destacada con su autoría.

Variantes

Guiding Business

Singular Beacon
Superficie

Regla de uso Siempre con autoría; si no se puede atribuir, no es una cita.

Código
<blockquote class="bb-c-quote bb-c-quote--filete">
            <p class="bb-c-quote__text">Guiding Business</p>
            <cite class="bb-c-quote__author">Singular Beacon</cite>
        </blockquote>

Estadística

202

elementos publicados en su sistema de diseño

Una cifra real y con fuente; si no hay dato, no hay estadística.

Variantes, estados y código

Una cifra con lo que significa.

Variantes

202

elementos publicados en su sistema de diseño

Acento

Regla de uso Una cifra real y con fuente; si no hay dato, no hay estadística.

Código
<div class="bb-c-stat bb-c-stat--superficie">
            <p class="bb-c-stat__value">202</p>
            <p class="bb-c-stat__label">elementos publicados en su sistema de diseño</p>
        </div>

Preguntas frecuentes

¿Qué es Singular Beacon?

Guiding Business

¿Qué la mueve?

Guiding Business

Preguntas que la gente hace de verdad, con la respuesta en la primera línea.

Variantes, estados y código

Preguntas que se abren y se cierran sin scripts.

Regla de uso Preguntas que la gente hace de verdad, con la respuesta en la primera línea.

Código
<div class="bb-c-faq">
            <details class="bb-c-faq__item" open="open">
                <summary class="bb-c-faq__q">¿Qué es Singular Beacon?</summary>
                <p class="bb-c-faq__a">Guiding Business</p>
            </details>
            <details class="bb-c-faq__item">
                <summary class="bb-c-faq__q">¿Qué la mueve?</summary>
                <p class="bb-c-faq__a">Guiding Business</p>
            </details>
        </div>

Pie

Sin promociones: identidad, enlaces legales y contacto.

Variantes, estados y código

El cierre de todas las páginas: marca y enlaces.

Variantes

Claro

Regla de uso Sin promociones: identidad, enlaces legales y contacto.

Código
<footer class="bb-c-footer bb-c-footer--oscuro" data-bb-theme="oscuro">
            <strong class="bb-c-footer__brand">Singular Beacon</strong>
            <ul class="bb-c-footer__links">
                <li><a href="#">Aviso legal</a></li>
                <li><a href="#">Privacidad</a></li>
                <li><a href="#">Contacto</a></li>
            </ul>
        </footer>

Campos de formulario

Cada campo con su etiqueta visible; el error se dice con palabras, no solo con color.

Variantes, estados y código

Campos de texto, correo y selección con su etiqueta, su ayuda y su error.

Estados

Normal
Foco
Error
Deshabilitado

Regla de uso Cada campo con su etiqueta visible; el error se dice con palabras, no solo con color.

Código
<form class="bb-c-form bb-c-form--base">
            <label class="bb-c-field">
                <span class="bb-c-field__label">Nombre</span>
                <input class="bb-c-field__input" type="text" value="Singular Beacon"/>
            </label>
            <label class="bb-c-field">
                <span class="bb-c-field__label">Correo electrónico</span>
                <input class="bb-c-field__input" type="email"/>
                <span class="bb-c-field__hint">Solo para responderte.</span>
            </label>
            <label class="bb-c-field">
                <span class="bb-c-field__label">Tema</span>
                <select class="bb-c-field__input">
                    <option>Singular Beacon</option>
                </select>
            </label>
        </form>

Selección

Tema

Una elección, tarjetas de opción; varias, casillas. Toda la tarjeta se pulsa y la elección nunca se dice solo con color.

Variantes, estados y código

Elegir una opción entre tarjetas, o varias con casillas.

Variantes

Tema
Casillas

Estados

Tema
Normal
Tema
Foco
Tema
Deshabilitado

Regla de uso Una elección, tarjetas de opción; varias, casillas. Toda la tarjeta se pulsa y la elección nunca se dice solo con color.

Código
<fieldset class="bb-c-choice bb-c-choice--tarjetas">
            <legend class="bb-c-field__label">Tema</legend>
                <label class="bb-c-option">
                    <input type="radio" name="bb-c-choice-normal" checked="True"/>
                    <span class="bb-c-option__title">Singular Beacon</span>
                    <span class="bb-c-option__text">Singular Beacon</span>
                </label>
        </fieldset>

Avisos

Guiding Business

Una frase que dice qué ha pasado y qué hacer; el color nunca es la única señal.

Variantes, estados y código

Un mensaje breve sobre lo que acaba de pasar.

Variantes

Recibido: te responde el equipo de Singular Beacon.

Éxito
Error

Regla de uso Una frase que dice qué ha pasado y qué hacer; el color nunca es la única señal.

Código
<div class="bb-c-alert bb-c-alert--info" role="status">
            <span class="bb-c-alert__mark" aria-hidden="true"></span>
            <p class="bb-c-alert__text">Guiding Business</p>
        </div>

Insignias

Marca Versión 3 Vigente

Una o dos palabras; nunca como botón.

Variantes, estados y código

Etiquetas cortas de estado, tipo o categoría.

Variantes

Marca Versión 3 Vigente

Compacta

Regla de uso Una o dos palabras; nunca como botón.

Código
<p class="bb-c-badges bb-c-badges--base">
            <span class="bb-c-badge bb-c-badge--acento">Marca</span>
            <span class="bb-c-badge">Versión 3</span>
            <span class="bb-c-badge bb-c-badge--borde">Vigente</span>
        </p>

Tabla

EstiloTamañoUso
Título display61 pxTítulos
Título 149 pxTítulo de página o de sección
Título 239 pxSubtítulo y título de tarjeta
Título 331 pxTítulo menor dentro de un bloque
Título 425 pxTítulos

Solo para datos que se comparan; la cabecera dice siempre qué es cada columna.

Variantes, estados y código

Datos en filas y columnas, con cabecera.

Variantes

EstiloTamañoUso
Título display61 pxTítulos
Título 149 pxTítulo de página o de sección
Título 239 pxSubtítulo y título de tarjeta
Título 331 pxTítulo menor dentro de un bloque
Título 425 pxTítulos
Rayada

Regla de uso Solo para datos que se comparan; la cabecera dice siempre qué es cada columna.

Código
<table class="bb-c-table bb-c-table--superficie">
            <thead><tr><th scope="col">Estilo</th><th scope="col">Tamaño</th><th scope="col">Uso</th></tr></thead>
            <tbody>
                <tr>
                    <td>Título display</td><td><code>61 px</code></td><td>Títulos</td>
                </tr><tr>
                    <td>Título 1</td><td><code>49 px</code></td><td>Título de página o de sección</td>
                </tr><tr>
                    <td>Título 2</td><td><code>39 px</code></td><td>Subtítulo y título de tarjeta</td>
                </tr><tr>
                    <td>Título 3</td><td><code>31 px</code></td><td>Título menor dentro de un bloque</td>
                </tr><tr>
                    <td>Título 4</td><td><code>25 px</code></td><td>Títulos</td>
                </tr>
            </tbody>
        </table>

Progreso

Propio de la marca en este libro95 %

Siempre con la cifra en texto junto a la barra.

Variantes, estados y código

Cuánto lleva algo hecho, como barra y como cifra.

Variantes

Propio de la marca en este libro95 %

Línea

Regla de uso Siempre con la cifra en texto junto a la barra.

Código
<div class="bb-c-progress bb-c-progress--acento">
            <p class="bb-c-progress__head"><span>Propio de la marca en este libro</span><strong>95 %</strong></p>
            <div class="bb-c-progress__track" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="95" aria-label="Propio de la marca en este libro">
                <span class="bb-c-progress__bar" style="width: 95%"></span>
            </div>
        </div>
07

Presentaciones

La piel de esta marca y la estructura común

Piel

Colores

  • Papel #F4F4F4
  • Tinta #0E0E0E
  • Titular #003E58
  • Acento #006EB7
  • Señal #CD3E19
  • Superficie #FFFFFF
  • Escenario #006EB7
  • Tinta del escenario #F4F4F4

Contraste mínimo de texto: 4.87:1

Composición

Titulares
Open Sans
Texto
Open Sans
Margen
1.25 in
Separación
0.35 in
Radio de tarjeta
0.042 in
Escala: portada, título, rótulo
40 · 30 · 22 pt

Descargar una muestra del deck. Contenido ficticio, sin ningún dato de cliente.

Estructura

  1. SB Cover Portada: título, cliente, referencia, fecha y logotipo del cliente
  2. SB Agenda Índice, con más de dos secciones
  3. SB Section Separador, con 4 láminas o más en una sección
  4. SB Content Las secciones incluidas, en su orden
  5. SB Closing Cierre: agradecimiento y contacto del responsable

Disposiciones de la plantilla

Portada
SB Cover
Índice
SB Agenda
Separador
SB Section
Texto
SB Content
Dos columnas
SB Two Columns
Tres columnas
SB Three Columns
Indicadores
SB KPI Tiles
Tabla
SB Table
Gantt
SB Gantt
Equipo
SB Team
Cierre
SB Closing
En blanco
SB Blank

Secciones con láminas propias

  • Objetivos, requisitos y alcance
  • Planificación e hitos
  • Modelo de gobierno
  • Equipo
  • Casos de éxito
  • Honorarios
  • Condiciones de pago
  • Términos y condiciones
08

Propuestas

Piezas que se imprimen

Piezas

Portada

A sangre, con el arte de la casa.

Cuerpo

Las secciones incluidas, numeradas, con cabecera y pie del sistema de documentos.

Aceptación

A sangre, con las casillas donde firma el cliente.

Contraportada

A sangre, con el arte y el pie legal.

Secciones que puede llevar el cuerpo

  • Antecedentes
  • Estado del arte
  • Objetivos, requisitos y alcance
  • Planificación e hitos
  • Metodología
  • Modelo de gobierno
  • Equipo
  • Equipo del cliente
  • Casos de éxito
  • Honorarios
  • Condiciones de pago
  • Términos y condiciones
  • Libre
09

Descargas

Tokens generados y ficheros

Ficheros

10

Para agentes

El contexto que recibe un agente

Lo publicado para esta audiencia, tal como lo lee un agente: lo obligatorio va primero.

Estilo de comunicación

14 / 20 líneas dentro del tope

Contexto
declaracion.mision: Singular Beacon, S.L. tiene como misión ayudar a sus clientes a desarrollar su máximo potencial digital gracias a un ecosistema de servicios y soluciones que simplifican la gestión, optimizan procesos y ayudan a tomar decisiones mejor informadas.
declaracion.objeto-social: [Singular Beacon, S.L. tiene] por objeto la prestación de servicios de asesoría, consultoría, comercialización, integración, desarrollo, implementación, mantenimiento y soporte de soluciones digitales.
declaracion.sobre-nosotros: Nos apasiona unir la tecnología y las ideas para crear soluciones digitales que impulsen el crecimiento y la innovación.
declaracion.slogan: Guiding Business
declaracion.servicios: Implantación de Odoo (ERP, CRM, proyectos, RR. HH., contabilidad) de principio a fin; data, analytics, BI e IA; digitalización de procesos; formación con The Singular Academy; Kit Digital y Kit Consulting (Acelera Pyme).
declaracion.contacto-postal: Martínez Villergas 49 V-1º, 28027 Madrid. España. [email protected]
declaracion.proposito: El grupo es la forma de crear un impacto positivo en el mundo
declaracion.webs: www.singularbeacon.com; la sociedad, Singular Beacon, S.L., en singularbeacon.sl.
declaracion.origen: Digital Branding (Londres, 2015: origen del grupo, no es división)
declaracion.legal-firma.es: Este mensaje y sus adjuntos son confidenciales y se dirigen exclusivamente a su destinatario. Si usted no es el destinatario previsto, le informamos que está prohibida su divulgación, copia o distribución sin autorización. Si ha recibido este mensaje por error, le rogamos nos lo comunique inmediatamente y proceda a su eliminación. En cumplimiento del Reglamento (UE) 2016/679 (RGPD) y la Ley Orgánica 3/2018 (LOPD-GDD), le informamos de que sus datos serán tratados por Singular Beacon, S.L. con el fin de mantener la relación profesional o comercial. Puede ejercer sus derechos en [email protected]. Más información: Política de Privacidad.
declaracion.legal-firma.en: This message and its attachments are confidential and intended solely for its addressee. If you are not the intended recipient, any disclosure, copy or distribution is prohibited. If you have received this message in error, please notify us immediately and delete it. In compliance with EU Regulation 2016/679 (GDPR) and Spanish Law 3/2018, your data will be processed by Singular Beacon, S.L. to maintain a professional or commercial relationship. You may exercise your rights at [email protected]. More info: Privacy Policy.
declaracion.objeto-social.incluye: Esto incluye pero no se limita a: - Inteligencia de Negocio y Analítica Avanzada: Consultoría de Gestión Empresarial, Procesos de Extracción y Transformación de datos (ETL), Desarrollo de Informes, Cuadros de Mando, Modelos Analíticos y Algoritmos mediante técnicas de Big Data, Machine Learning e Inteligencia Artificial. - Soluciones Digital y Cloud: Soluciones Corporativas y Ofimática, Sistemas de Gestión Corporativo y Comercial (ERP y CRM), Software Especializado, Dominios, Infraestructura Digital y Computación en la Nube (Cloud) tanto de desarrollo propio como de terceros. - Ciberseguridad y Cumplimiento Normativo (compliance): Evaluación de Riesgos, Análisis de Vulnerabilidades (PenTesting), Certificaciones de Seguridad Informática, Análisis Forense Digital (Forensics) y Protección de Datos. - Marketing y Comunicación: Estrategia Digital, Publicidad Digital (SEM), Optimización en Buscadores (SEO), Gestión de Redes Sociales (Community Management) y Desarrollo de Contenido (Copywriting) - Diseño Gráfico, Experiencia de Usuario (UX) e Interfaces (UI): Desarrollo de identidad corporativa y activos digitales tales como logotipos, videos, iconos, imágenes plantillas e interfaces web o de aplicaciones.
valor.pilar.datos-para-decidir: Datos para decidir
valor.pilar.personas-en-el-centro: Personas en el centro
… 6 líneas recortadas por el tope, 0 obligatorias: pide un max_chars mayor.
Cómo pedirlo
env["sb.brand"].sb_context("singular-beacon", purpose="redactar")

Directrices para agentes de imágenes

39 / 63 líneas dentro del tope

Contexto
NUNCA accessibility color.prohibido.1: No usar #006EB7 sobre #003E58: contraste 2.13:1, por debajo de AA.
NUNCA accessibility color.prohibido.2: No usar #003E58 sobre #0E0E0E: contraste 1.68:1, por debajo de AA.
NUNCA accessibility color.prohibido.3: No usar #006EB7 sobre #0E0E0E: contraste 3.59:1, por debajo de AA.
NUNCA logo logo.no-recrear: No recrees el logotipo desde cero, utiliza estos.
NUNCA logo logo.solo-colores-dados: Los logotipos solo deben usarse en los colores proporcionados.
NUNCA logo logo.no-redibujar: El faro y el lema «Guiding Business» no se redibujan, no se recolorean, no se generan.
color.primario: #006eb7 · Azul principal · Azul principal de la marca; botones primarios y enlaces sobre fondo claro.
color.secundario: #003e58 · Marino · Marino; texto del logotipo, titulares destacados y fondo oscuro de panel.
color.oscuro: #0e0e0e · Negro · Negro de marca; texto principal sobre claro y fondo del tema oscuro.
color.claro: #f4f4f4 · Blanco roto · Blanco roto; fondo de página claro y texto sobre oscuro.
color.acento: #cd3e19 · Naranja · Naranja de acento (propuesta, de KB 14); rellenos y acentos, no texto sobre claro (4,44 : 1).
color.gris-oscuro: #3c3c3b · Gris oscuro · Gris oscuro (propuesta, de KB 14); texto secundario sobre claro.
color.gris-claro: #dadada · Gris claro · Gris claro (propuesta, de KB 14); texto secundario sobre oscuro y filetes.
color.blanco: #ffffff · Blanco · Blanco; superficie de tarjeta clara y detalle de iconos.
color.cielo: #8fd3ff · Cielo · Cielo; azul claro para enlaces, foco y primario en tema oscuro.
color.ambar: #ff9a62 · Ámbar · Ámbar de la web; decoración, no texto.
color.noche: #021620 · Noche · Noche de la web; fondos muy oscuros de cabecera.
color.tinta: #05283a · Tinta · Tinta de la web; degradado bajo texto sobre foto y sombras.
color.icono.solape: #56abe2 · Solape de iconos · Solape por transparencia de los iconos de app (0,6 × #8FD3FF + 0,4 × #006EB7).
color.icono.fondo-oscuro: #262a36 · Fondo oscuro de comprobación de iconos · Fondo oscuro de la hoja de contacto de iconos.
color.duotono.sombra: #02161f · Duotono, sombra · Sombras del duotono de foto (tratamiento en revisión).
color.duotono.medio: #006088 · Duotono, medios tonos · Medios tonos del duotono de foto (tratamiento en revisión).
color.duotono.luz: #e2eef4 · Duotono, luces · Luces del duotono de foto (tratamiento en revisión).
color.primario.50: #f0f8ff · Azul principal 50 · Rampa derivada del azul principal (propuesta): paso 50.
color.primario.100: #c5e2fe · Azul principal 100 · Rampa derivada del azul principal (propuesta): paso 100.
color.primario.200: #a3caf0 · Azul principal 200 · Rampa derivada del azul principal (propuesta): paso 200.
color.primario.300: #82b3e2 · Azul principal 300 · Rampa derivada del azul principal (propuesta): paso 300.
color.primario.400: #609cd4 · Azul principal 400 · Rampa derivada del azul principal (propuesta): paso 400.
color.primario.500: #3b85c6 · Azul principal 500 · Rampa derivada del azul principal (propuesta): paso 500.
color.primario.700: #005189 · Azul principal 700 · Rampa derivada del azul principal (propuesta): paso 700.
color.primario.800: #00355d · Azul principal 800 · Rampa derivada del azul principal (propuesta): paso 800.
color.primario.900: #001c35 · Azul principal 900 · Rampa derivada del azul principal (propuesta): paso 900.
color.marino.50: #eef9ff · Marino 50 · Rampa derivada del marino (propuesta): paso 50.
color.marino.100: #cfe0ea · Marino 100 · Rampa derivada del marino (propuesta): paso 100.
color.marino.200: #b1c7d4 · Marino 200 · Rampa derivada del marino (propuesta): paso 200.
color.marino.300: #94afbe · Marino 300 · Rampa derivada del marino (propuesta): paso 300.
color.marino.400: #7897a9 · Marino 400 · Rampa derivada del marino (propuesta): paso 400.
color.marino.500: #5c8094 · Marino 500 · Rampa derivada del marino (propuesta): paso 500.
fuente.primaria: Open Sans
… 24 líneas recortadas por el tope, 0 obligatorias: pide un max_chars mayor.
Cómo pedirlo
env["sb.brand"].sb_context("singular-beacon", purpose="imagen")
11

Versiones

Historial publicado

  1. v3 2026-11-04 Aprobación Vigente 14 claves cambiadas
  2. v2 2026-11-04 Aprobación 188 claves cambiadas
  3. v1 2026-11-03 Aprobación