¿que es un breakpoint en cuanto a diseño? ¿podrán aportar algún link con un ejemplo gráfico? Gracias :)

un breakpoint es un valor de ancho(en web, generalmente en pixeles) que se toma en cuenta para fijar el límite entre dos dispositivos (móvil-tablet, tablet-desktop). Estos breakpoints ayudan a planificar y adaptar un diseño base a cada dispositivo, pues tienes una dimensión a tomar en cuenta sobre la que trabajar. Es un concepto clave en el "responsive design".

Como ejemplo gráfico, más que un enlace, puedes tomar esta misma página. Si reduces el tamaño de tu navegador verás como la misma se va adaptando a diferentes resoluciones, fíjate que hay un momento en el cual desaparecerán las discusiones y el menú superior cambiará a un botón de menú único. Ese ancho, en el momento en que cambia una disposición del diseño a otra es un breakpoint, y delimita la visualización del sitio que tendrán dispositivos de pantallas pequeñas y los de pantallas grandes. En el caso de mejorando, se utiliza un sólo breakpoint, pero podrías definir más.

Puedes intentar lo mismo con este sitio:

smashingmagazine.com

Y realizando lo mismo, notarás que aquí usan 2 breakpoints(que es la cantidad que por lo general se usa).

Espero eso haya aclarado tu duda.