En smashingmagazine.com encontré este espectacular post…. trate de traducirlo lo mejor posible con ayuda de un amigo y google por supuesto… no hay nada mas que Agregar espero que lo disfruten tanto como yo!
"Las matemáticas son bellas." Esto puede sonar absurdo a la gente que una mueca de dolor en los números y las ecuaciones. Pero algunas de las cosas más hermosas de la naturaleza y nuestra exposición universo propiedades matemáticas, desde la más pequeña concha a las galaxias más grandes de hidromasaje. De hecho, uno de los más grandes filósofos antiguos, Aristóteles, dijo: "Las ciencias matemáticas en particular, para exponer, la simetría y la limitación, y estas son las más grandes formas de la belleza."
Debido a su bella naturaleza, las matemáticas han sido una parte de arte y de diseño arquitectónico para las edades. Pero no se ha explotado mucho para el diseño de página web. Esto es probablemente porque muchos de nosotros consideramos las matemáticas como la antítesis de la creatividad. Por el contrario, las matemáticas pueden ser una herramienta para producir diseños creativos. Dicho esto, usted no tiene que depender de las matemáticas para cada diseño. El punto es que usted debe considerar como su amigo, no un enemigo. A título ilustrativo, hemos creado un par de diseños web que presente los principios matemáticos mencionados en este artículo. También estamos regalando un par de PSD que se puede utilizar de inmediato en su próximo diseño.
Diseños presentados en este post se creó específicamente para el propósito de este artículo. Durante el proceso de diseño nos aseguramos de que todos los diseños que se muestran en este artículo son esencialmente matemática en la naturaleza, es decir, que para exhibir, la simetría y la limitación. También han seguido el algoritmo de diseño Web en este proceso – los diseños tienen temas diferentes, estilos y elementos. Para mantener las cosas simples y claras, hemos intentado ceñirse a los diseños minimalistas y también prefiere los diseños de página única. Obviamente, los ejemplos en este artículo se supone que sirven como base para sus diseños simples y no como los diseños terminados.
[Offtopic: por cierto, ¿ha visitado ya la página Smashing Magazine Facebook ventilador? Únete a la comunidad para un flujo de recursos útiles, actualizaciones y regalos!]
Golden Ratio y Golden Rectangle
La proporción de oro, también conocido como la proporción divina, es una constante matemática irracional con un valor de aproximadamente 1,618033987. Si la proporción de la suma de las cantidades a la mayor cantidad es igual a la relación de la cantidad más grande al más pequeño, entonces las cantidades que se dice que tienen una proporción de oro.
Ya hemos publicado un artículo muy detallado "Aplicando la Divina Proporción a diseño web", que explica cómo utilizar la proporción áurea en diseño web. En el artículo de hoy, veremos cómo utilizar rectángulos de oro en diseño web. Un rectángulo de oro es una de cuyas longitudes de los lados tiene la razón áurea 1: (uno-a-PHI), es decir, 1:1.618.
La construcción de un rectángulo de oro es muy fácil y sencillo. En primer lugar, construir un simple cuadrado. Luego, dibuja una línea desde el punto medio de uno de los lados de la plaza a una esquina opuesta y el uso de esa línea como el radio a dibujar un arco que define la altura del rectángulo. Por último, completa el rectángulo de oro y ya está.
Un método para construir un rectángulo de oro. La plaza está marcada en rojo. Las dimensiones resultantes son en la proporción 1: Phi, el número áureo.
Como ejemplo, considere el diseño minimalista de abajo. Tiene seis rectángulos de oro en ella, tres rectángulos por línea. Los rectángulos tienen las dimensiones de 299 x 185 píxeles. Por lo tanto, los lados de estos rectángulos se adhieren aproximadamente a la proporción áurea, o sea, 299/185 = 1,616. Observe cómo la gran cantidad de espacio en blanco que rodea rectángulos de oro en una atmósfera serena y simple en la que las opciones de navegación puede respirar y cumplir su propósito. Aunque el diseño utiliza colores muy pocos y todos los bloques se colocan de manera muy similar, las opciones de navegación son evidentes.
Sin embargo, puede ser muy difícil para añadir un bloque de oro nuevo, manteniendo la coherencia del diseño. Probablemente la única solución de diseño razonable aquí sería añadir el bloque en la tercera línea y usar el resto del espacio horizontal para otras características más o menos importante (si es necesario). Puede hacer clic en la imagen para ver la versión ampliada.
Posibles aplicaciones
El diseño del rectángulo de oro es muy adecuado para galerías de fotos, carteras y productos orientados a sitios web. Los rectángulos de oro también se puede organizar en otras formas matemáticamente sonido para generar diseños hermosos. En particular, es posible que desee utilizarlos para los bloques que muestran imágenes o anuncios en la barra lateral. Por supuesto, la colección de rectángulos de oro puro no tiene un profesional, el diseño de aspecto agradable. También es necesario colaborar estrechamente con las redes, la alineación, la proximidad y la importancia de alcanzar los objetivos principales de su diseño. Por ejemplo, una solución de diseño interesante sería un / CSS-jQuery fluido a base de cuadrícula de diseño basado en rectángulos de oro, sin embargo, no cubren esta técnica en este artículo.
Descargar el PSD-diseño
Hemos preparado una muestra de la División de diseño que se ha diseñado de acuerdo a la proporción áurea y rectángulo de oro. Por favor, siéntase libre de utilizar de cualquier forma y por favor enviar el link a este artículo a sus colegas si quiere correr la voz.
Diseño de Fibonacci
Como su nombre indica, los diseños de Fibonacci son diseños basados en la secuencia de Fibonacci de los números. Por definición, los dos primeros números de Fibonacci son 0 y 1, y cada número restante es la suma de los dos anteriores. Algunas fuentes omita el 0 inicial, en lugar de comenzar la secuencia con dos 1s. Así que los dos primeros números de Fibonacci se dan, y cada número restante es la suma de los dos anteriores. Cuanto mayor sea la secuencia de Fibonacci consigue, más cerca de sus números se relacionan entre sí de acuerdo a la proporción áurea. Una secuencia de Fibonacci es la siguiente:
0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144...
En la música, los números de Fibonacci se usan a veces para determinar afinaciones, y en el arte visual para determinar la longitud o el tamaño de los elementos de contenido y formal. Schmidhuber, Jürgen su metodología de Fibonacci diseños basados en su blog. Sin embargo, si se examina el diseño creado por él, es probable que les resulta difícil rígidas y un poco a leer y navegar. De hecho, tiene que ser un poco creativo con las matemáticas en lugar de seguir ciegamente las normas – las matemáticas nos da una guía que se puede aplicar, sin embargo es más bien de la implementación de sitios con las matemáticas de la aplicación de las matemáticas con nuestros diseños.
Espirales de oro aproximado y verdadero. La espiral de color verde se hace de los cuartos de círculos tangentes al interior de cada cuadrado, mientras que la espiral roja es una espiral de oro, un tipo especial de espiral logarítmica. Partes separadas aparecen de color amarillo. La longitud de los lados de un cuadrado dividido por el cuadrado más pequeño de la siguiente es la proporción de oro. Origen
La idea principal detrás de estos diseños es el uso de Fibonacci la hora de decidir sobre las dimensiones de área de contenido o la barra lateral. Ambos ratio de Oro y de Fibonacci permiten a los diseñadores se basan en el sonido, las relaciones comunes de contenedores de página o bloques dentro de contenedores de la página.
En general, los diseños son muy fáciles de construir con la secuencia de Fibonacci. Usted escoge un ancho de base de determinadas primero – por ejemplo, 90px. Luego, cuando la determinación del tamaño de sus envases, se multiplica el ancho de la base con los números de la serie de Fibonacci. Dependiendo de los cálculos que recibe, es necesario usarlos para sus bloques de página. Echemos un vistazo a un ejemplo. A continuación se muestra una tipografía minimalista blog sobre la base de Fibonacci de diseño Web.
Vista grande
Usted puede ver que la página está dividida en tres columnas. Cada columna corresponde a un número de Fibonacci. Para este diseño, se utilizó una base de ancho de 90 píxeles. Esta anchura de la base se multiplica por un número de Fibonacci para obtener el ancho total de una columna en particular. Por ejemplo, la primera columna tiene un ancho de 180 píxeles (90 x 2); la segunda columna tiene un ancho de 270 píxeles (90 x 3), y la tercera columna tiene una anchura de 720 píxeles (90 x 8). El tamaño de fuente también corresponde a una serie de Fibonacci. El blog de la partida tiene un tamaño de 55px; el artículo de partida es 34px; y el contenido es 21px.
La desventaja de diseños basados en la secuencia de Fibonacci es que es difícil de usar si se le da ciertas dimensiones del diseño de ancho fijo (por ejemplo, 1000px). En esta situación, es más fácil usar la relación de Oro, que sólo tendría que multiplicar 1000px con 0,618 y recibe 618px que sería el ancho ideal para su bloque de contenido. Sin embargo, si usted intenta alcanzar el mismo resultado con la secuencia de Fibonacci en sí, primero tiene que averiguar la secuencia para la gama 1000.
Según la calculadora de secuencia de Fibonacci, la secuencia sería ...,610, 987, 1597... De hecho, 987 es un buen ajuste y se puede comenzar a escoger el ancho de los bloques más pequeños utilizando los números anteriores en la secuencia. Pero si el diseño de ancho fijo es más pequeño o la rubia, usted tendría que usar algunos valores aproximados que daría lugar otra vez en pura conjetura. El problema también puede producirse en los diseños de líquido o elástico, en cierta medida, pero usted tiene la libertad de diseño mucho más allá.
Posibles aplicaciones
Un diseño de Fibonacci es el más adecuado a los blogs y los diseños de la revista. Usted puede organizar el diseño de diferentes maneras según los números de Fibonacci. El artículo "Nombre d’Or, de Fibonacci et autres rejillas suite de mise en page pour le web de diseño" (en francés), explica con más detalle la aplicación de los números de Fibonacci para el diseño web. Una vez más, el aviso que usted necesita para ser creativo al usar la secuencia de Fibonacci en sus diseños, de lo contrario sus diseños a su vez ser demasiado rígido y por lo tanto difíciles de usar y navegar.
Descargar el PSD-diseño
Hemos preparado una muestra de la División de diseño que se ha diseñado de acuerdo a la secuencia de Fibonacci. Por favor, siéntase libre de utilizar de cualquier forma y por favor enviar el link a este artículo a sus colegas si quiere correr la voz.
Cinco elementos o Kundli Diseño
Otra técnica de diseño interesante viene de los horóscopos indio que también se llaman Kundli. Básicamente, un Kundli es una figura muy simple se puede hacer en sólo tres pasos. Dibujar un cuadrado, y luego cruzar las dos diagonales. Únete a los puntos medios de cada lado de la plaza para obtener la cifra Kundli. Se dará cuenta de cuatro rombos ángulo derecho de la figura. Estos son la base de nuestro diseño web.
El diseño de abajo, entonces, se basa en el diseño de Kundli geométricas. Usted notará que el chakras en el diseño también tiene propiedades matemáticas.
Vista grande
Este es un diseño de página única. Al hacer clic en un elemento revela más información al respecto, como se muestra en la siguiente figura. También podría incluir algunas animaciones simples o herramientas jQuery jQuery que puedan revelar más información sobre la demanda. Un paso adelante sería una página web móvil donde la animación se utiliza para mostrar diferentes bloques de contenido, puede que también quiera cambiar las imágenes de fondo de las áreas de contenido único para hacerlos un poco más distintivo.
En la siguiente figura, se puede ver que nuestro diseño es sólo un diseño simple de tres columnas: una cabecera, tres columnas y un pie de página. No es en absoluto compleja.
Posibles aplicaciones
Este diseño es el mejor para mostrar la información de productos y carteras. Puede sazonarlo con los marcos de animación de JavaScript. Por ejemplo, usted puede aplicar transformaciones de color a los chakras mediante el uso de la colección de Rafael, o usted puede agregar animaciones de estilo libre utilizando la colección de jsAnim. Usted puede tener un árbol brotan cuando el usuario hace clic en el elemento de la Tierra, o puede mostrar las criaturas del mar nadando en el elemento agua. El cielo es el límite cuando se trata de animación usando estas bibliotecas JavaScript.
Descargar el PSD-diseño
Hemos preparado una muestra de la División de diseño que se ha diseñado de acuerdo con el diseño Kundli. Por favor, siéntase libre de utilizar de cualquier forma y por favor enviar el link a este artículo a sus colegas si quiere correr la voz.
Sine Wave Design
Cuando se trata de Mathmatics, no es necesario atenerse a conocidos Golden Ratio o la secuencia de Fibonacci. También puede experimentar con fórmulas de la física, la química y otras ciencias por medio de fórmulas más generales y los valores en sus diseños.
Por ejemplo, consideremos la onda sinusoidal o sinusoide, una función matemática que describe una oscilación repetitiva suave. Se utilizó un sencillo modelo de onda sinusoidal, como la base para un diseño web simple y original y crear un diseño de una sola página. Por supuesto, usted puede utilizar el mismo enfoque para otros diseños, tales como gráficos o infografías.
Vista grande
La disposición es de nuevo muy simple, que consiste en una cabecera, cinco columnas y un pie de página. Usted puede usar una descripción jQuery para hacer el diseño más interactivo.
Posibles aplicaciones
Este patrón de onda se produce a menudo en la naturaleza, incluidas las olas del mar, las ondas sonoras y las ondas de luz. Además, un patrón sinusoidal en bruto se pueden ver en el trazado de las temperaturas promedio para cada día del año, aunque el gráfico pueden parecerse a los de una onda coseno invertida. También se puede utilizar para mostrar un calendario de eventos. Incluso podría ser desarrollado para incluir la navegación horizontal. Usted puede hacerlo más interactivo con enchufe el marcador jQuery-in, que pone de relieve cada elemento (es decir, DIV), de modo que el usuario puede centrarse en el contenido.
Descargar el PSD-diseño
Hemos preparado una muestra de la División de diseño que se ha diseñado de acuerdo con el diseño de onda sinusoidal. Por favor, siéntase libre de utilizar de cualquier forma y por favor enviar el link a este artículo a sus colegas si quiere correr la voz.
Otras técnicas
Regla de los tercios
Esta norma establece que una imagen debe ser imaginada para ser dividida en nueve partes iguales por dos líneas horizontales equidistantes y dos líneas verticales equidistantes, y que importantes elementos de la composición debe ser colocado a lo largo de estas líneas o sus intersecciones. También puede ser expresado como un enfoque matemático simplificado que divide a cualquier diseño en tercios, de izquierda a derecha y de arriba a abajo.
Lógica musical
La estructura rítmica o temática de las composiciones musicales se pueden aplicar a las distancias entre elementos en un diseño, como la ABA, ABAC, etc Aprenda más sobre la música y las matemáticas en este artículo de Wikipedia.
Enlaces de interés y de los Recursos
Artículos de la Wikipedia
http://ciberdix.net/site/2010/02/10/la-aplicacin-de-las-matemticas-para-diseo-web-2/
"Las matemáticas son bellas." Esto puede sonar absurdo a la gente que una mueca de dolor en los números y las ecuaciones. Pero algunas de las cosas más hermosas de la naturaleza y nuestra exposición universo propiedades matemáticas, desde la más pequeña concha a las galaxias más grandes de hidromasaje. De hecho, uno de los más grandes filósofos antiguos, Aristóteles, dijo: "Las ciencias matemáticas en particular, para exponer, la simetría y la limitación, y estas son las más grandes formas de la belleza."
Debido a su bella naturaleza, las matemáticas han sido una parte de arte y de diseño arquitectónico para las edades. Pero no se ha explotado mucho para el diseño de página web. Esto es probablemente porque muchos de nosotros consideramos las matemáticas como la antítesis de la creatividad. Por el contrario, las matemáticas pueden ser una herramienta para producir diseños creativos. Dicho esto, usted no tiene que depender de las matemáticas para cada diseño. El punto es que usted debe considerar como su amigo, no un enemigo. A título ilustrativo, hemos creado un par de diseños web que presente los principios matemáticos mencionados en este artículo. También estamos regalando un par de PSD que se puede utilizar de inmediato en su próximo diseño.
Diseños presentados en este post se creó específicamente para el propósito de este artículo. Durante el proceso de diseño nos aseguramos de que todos los diseños que se muestran en este artículo son esencialmente matemática en la naturaleza, es decir, que para exhibir, la simetría y la limitación. También han seguido el algoritmo de diseño Web en este proceso – los diseños tienen temas diferentes, estilos y elementos. Para mantener las cosas simples y claras, hemos intentado ceñirse a los diseños minimalistas y también prefiere los diseños de página única. Obviamente, los ejemplos en este artículo se supone que sirven como base para sus diseños simples y no como los diseños terminados.
[Offtopic: por cierto, ¿ha visitado ya la página Smashing Magazine Facebook ventilador? Únete a la comunidad para un flujo de recursos útiles, actualizaciones y regalos!]
Golden Ratio y Golden Rectangle
La proporción de oro, también conocido como la proporción divina, es una constante matemática irracional con un valor de aproximadamente 1,618033987. Si la proporción de la suma de las cantidades a la mayor cantidad es igual a la relación de la cantidad más grande al más pequeño, entonces las cantidades que se dice que tienen una proporción de oro.
Ya hemos publicado un artículo muy detallado "Aplicando la Divina Proporción a diseño web", que explica cómo utilizar la proporción áurea en diseño web. En el artículo de hoy, veremos cómo utilizar rectángulos de oro en diseño web. Un rectángulo de oro es una de cuyas longitudes de los lados tiene la razón áurea 1: (uno-a-PHI), es decir, 1:1.618.
La construcción de un rectángulo de oro es muy fácil y sencillo. En primer lugar, construir un simple cuadrado. Luego, dibuja una línea desde el punto medio de uno de los lados de la plaza a una esquina opuesta y el uso de esa línea como el radio a dibujar un arco que define la altura del rectángulo. Por último, completa el rectángulo de oro y ya está.
Un método para construir un rectángulo de oro. La plaza está marcada en rojo. Las dimensiones resultantes son en la proporción 1: Phi, el número áureo.
Como ejemplo, considere el diseño minimalista de abajo. Tiene seis rectángulos de oro en ella, tres rectángulos por línea. Los rectángulos tienen las dimensiones de 299 x 185 píxeles. Por lo tanto, los lados de estos rectángulos se adhieren aproximadamente a la proporción áurea, o sea, 299/185 = 1,616. Observe cómo la gran cantidad de espacio en blanco que rodea rectángulos de oro en una atmósfera serena y simple en la que las opciones de navegación puede respirar y cumplir su propósito. Aunque el diseño utiliza colores muy pocos y todos los bloques se colocan de manera muy similar, las opciones de navegación son evidentes.
Sin embargo, puede ser muy difícil para añadir un bloque de oro nuevo, manteniendo la coherencia del diseño. Probablemente la única solución de diseño razonable aquí sería añadir el bloque en la tercera línea y usar el resto del espacio horizontal para otras características más o menos importante (si es necesario). Puede hacer clic en la imagen para ver la versión ampliada.
Posibles aplicaciones
El diseño del rectángulo de oro es muy adecuado para galerías de fotos, carteras y productos orientados a sitios web. Los rectángulos de oro también se puede organizar en otras formas matemáticamente sonido para generar diseños hermosos. En particular, es posible que desee utilizarlos para los bloques que muestran imágenes o anuncios en la barra lateral. Por supuesto, la colección de rectángulos de oro puro no tiene un profesional, el diseño de aspecto agradable. También es necesario colaborar estrechamente con las redes, la alineación, la proximidad y la importancia de alcanzar los objetivos principales de su diseño. Por ejemplo, una solución de diseño interesante sería un / CSS-jQuery fluido a base de cuadrícula de diseño basado en rectángulos de oro, sin embargo, no cubren esta técnica en este artículo.
Descargar el PSD-diseño
Hemos preparado una muestra de la División de diseño que se ha diseñado de acuerdo a la proporción áurea y rectángulo de oro. Por favor, siéntase libre de utilizar de cualquier forma y por favor enviar el link a este artículo a sus colegas si quiere correr la voz.
Diseño de Fibonacci
Como su nombre indica, los diseños de Fibonacci son diseños basados en la secuencia de Fibonacci de los números. Por definición, los dos primeros números de Fibonacci son 0 y 1, y cada número restante es la suma de los dos anteriores. Algunas fuentes omita el 0 inicial, en lugar de comenzar la secuencia con dos 1s. Así que los dos primeros números de Fibonacci se dan, y cada número restante es la suma de los dos anteriores. Cuanto mayor sea la secuencia de Fibonacci consigue, más cerca de sus números se relacionan entre sí de acuerdo a la proporción áurea. Una secuencia de Fibonacci es la siguiente:
0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144...
En la música, los números de Fibonacci se usan a veces para determinar afinaciones, y en el arte visual para determinar la longitud o el tamaño de los elementos de contenido y formal. Schmidhuber, Jürgen su metodología de Fibonacci diseños basados en su blog. Sin embargo, si se examina el diseño creado por él, es probable que les resulta difícil rígidas y un poco a leer y navegar. De hecho, tiene que ser un poco creativo con las matemáticas en lugar de seguir ciegamente las normas – las matemáticas nos da una guía que se puede aplicar, sin embargo es más bien de la implementación de sitios con las matemáticas de la aplicación de las matemáticas con nuestros diseños.
Espirales de oro aproximado y verdadero. La espiral de color verde se hace de los cuartos de círculos tangentes al interior de cada cuadrado, mientras que la espiral roja es una espiral de oro, un tipo especial de espiral logarítmica. Partes separadas aparecen de color amarillo. La longitud de los lados de un cuadrado dividido por el cuadrado más pequeño de la siguiente es la proporción de oro. Origen
La idea principal detrás de estos diseños es el uso de Fibonacci la hora de decidir sobre las dimensiones de área de contenido o la barra lateral. Ambos ratio de Oro y de Fibonacci permiten a los diseñadores se basan en el sonido, las relaciones comunes de contenedores de página o bloques dentro de contenedores de la página.
En general, los diseños son muy fáciles de construir con la secuencia de Fibonacci. Usted escoge un ancho de base de determinadas primero – por ejemplo, 90px. Luego, cuando la determinación del tamaño de sus envases, se multiplica el ancho de la base con los números de la serie de Fibonacci. Dependiendo de los cálculos que recibe, es necesario usarlos para sus bloques de página. Echemos un vistazo a un ejemplo. A continuación se muestra una tipografía minimalista blog sobre la base de Fibonacci de diseño Web.
Vista grande
Usted puede ver que la página está dividida en tres columnas. Cada columna corresponde a un número de Fibonacci. Para este diseño, se utilizó una base de ancho de 90 píxeles. Esta anchura de la base se multiplica por un número de Fibonacci para obtener el ancho total de una columna en particular. Por ejemplo, la primera columna tiene un ancho de 180 píxeles (90 x 2); la segunda columna tiene un ancho de 270 píxeles (90 x 3), y la tercera columna tiene una anchura de 720 píxeles (90 x 8). El tamaño de fuente también corresponde a una serie de Fibonacci. El blog de la partida tiene un tamaño de 55px; el artículo de partida es 34px; y el contenido es 21px.
La desventaja de diseños basados en la secuencia de Fibonacci es que es difícil de usar si se le da ciertas dimensiones del diseño de ancho fijo (por ejemplo, 1000px). En esta situación, es más fácil usar la relación de Oro, que sólo tendría que multiplicar 1000px con 0,618 y recibe 618px que sería el ancho ideal para su bloque de contenido. Sin embargo, si usted intenta alcanzar el mismo resultado con la secuencia de Fibonacci en sí, primero tiene que averiguar la secuencia para la gama 1000.
Según la calculadora de secuencia de Fibonacci, la secuencia sería ...,610, 987, 1597... De hecho, 987 es un buen ajuste y se puede comenzar a escoger el ancho de los bloques más pequeños utilizando los números anteriores en la secuencia. Pero si el diseño de ancho fijo es más pequeño o la rubia, usted tendría que usar algunos valores aproximados que daría lugar otra vez en pura conjetura. El problema también puede producirse en los diseños de líquido o elástico, en cierta medida, pero usted tiene la libertad de diseño mucho más allá.
Posibles aplicaciones
Un diseño de Fibonacci es el más adecuado a los blogs y los diseños de la revista. Usted puede organizar el diseño de diferentes maneras según los números de Fibonacci. El artículo "Nombre d’Or, de Fibonacci et autres rejillas suite de mise en page pour le web de diseño" (en francés), explica con más detalle la aplicación de los números de Fibonacci para el diseño web. Una vez más, el aviso que usted necesita para ser creativo al usar la secuencia de Fibonacci en sus diseños, de lo contrario sus diseños a su vez ser demasiado rígido y por lo tanto difíciles de usar y navegar.
Descargar el PSD-diseño
Hemos preparado una muestra de la División de diseño que se ha diseñado de acuerdo a la secuencia de Fibonacci. Por favor, siéntase libre de utilizar de cualquier forma y por favor enviar el link a este artículo a sus colegas si quiere correr la voz.
Cinco elementos o Kundli Diseño
Otra técnica de diseño interesante viene de los horóscopos indio que también se llaman Kundli. Básicamente, un Kundli es una figura muy simple se puede hacer en sólo tres pasos. Dibujar un cuadrado, y luego cruzar las dos diagonales. Únete a los puntos medios de cada lado de la plaza para obtener la cifra Kundli. Se dará cuenta de cuatro rombos ángulo derecho de la figura. Estos son la base de nuestro diseño web.
El diseño de abajo, entonces, se basa en el diseño de Kundli geométricas. Usted notará que el chakras en el diseño también tiene propiedades matemáticas.
Vista grande
Este es un diseño de página única. Al hacer clic en un elemento revela más información al respecto, como se muestra en la siguiente figura. También podría incluir algunas animaciones simples o herramientas jQuery jQuery que puedan revelar más información sobre la demanda. Un paso adelante sería una página web móvil donde la animación se utiliza para mostrar diferentes bloques de contenido, puede que también quiera cambiar las imágenes de fondo de las áreas de contenido único para hacerlos un poco más distintivo.
En la siguiente figura, se puede ver que nuestro diseño es sólo un diseño simple de tres columnas: una cabecera, tres columnas y un pie de página. No es en absoluto compleja.
Posibles aplicaciones
Este diseño es el mejor para mostrar la información de productos y carteras. Puede sazonarlo con los marcos de animación de JavaScript. Por ejemplo, usted puede aplicar transformaciones de color a los chakras mediante el uso de la colección de Rafael, o usted puede agregar animaciones de estilo libre utilizando la colección de jsAnim. Usted puede tener un árbol brotan cuando el usuario hace clic en el elemento de la Tierra, o puede mostrar las criaturas del mar nadando en el elemento agua. El cielo es el límite cuando se trata de animación usando estas bibliotecas JavaScript.
Descargar el PSD-diseño
Hemos preparado una muestra de la División de diseño que se ha diseñado de acuerdo con el diseño Kundli. Por favor, siéntase libre de utilizar de cualquier forma y por favor enviar el link a este artículo a sus colegas si quiere correr la voz.
Sine Wave Design
Cuando se trata de Mathmatics, no es necesario atenerse a conocidos Golden Ratio o la secuencia de Fibonacci. También puede experimentar con fórmulas de la física, la química y otras ciencias por medio de fórmulas más generales y los valores en sus diseños.
Por ejemplo, consideremos la onda sinusoidal o sinusoide, una función matemática que describe una oscilación repetitiva suave. Se utilizó un sencillo modelo de onda sinusoidal, como la base para un diseño web simple y original y crear un diseño de una sola página. Por supuesto, usted puede utilizar el mismo enfoque para otros diseños, tales como gráficos o infografías.
Vista grande
La disposición es de nuevo muy simple, que consiste en una cabecera, cinco columnas y un pie de página. Usted puede usar una descripción jQuery para hacer el diseño más interactivo.
Posibles aplicaciones
Este patrón de onda se produce a menudo en la naturaleza, incluidas las olas del mar, las ondas sonoras y las ondas de luz. Además, un patrón sinusoidal en bruto se pueden ver en el trazado de las temperaturas promedio para cada día del año, aunque el gráfico pueden parecerse a los de una onda coseno invertida. También se puede utilizar para mostrar un calendario de eventos. Incluso podría ser desarrollado para incluir la navegación horizontal. Usted puede hacerlo más interactivo con enchufe el marcador jQuery-in, que pone de relieve cada elemento (es decir, DIV), de modo que el usuario puede centrarse en el contenido.
Descargar el PSD-diseño
Hemos preparado una muestra de la División de diseño que se ha diseñado de acuerdo con el diseño de onda sinusoidal. Por favor, siéntase libre de utilizar de cualquier forma y por favor enviar el link a este artículo a sus colegas si quiere correr la voz.
Otras técnicas
Regla de los tercios
Esta norma establece que una imagen debe ser imaginada para ser dividida en nueve partes iguales por dos líneas horizontales equidistantes y dos líneas verticales equidistantes, y que importantes elementos de la composición debe ser colocado a lo largo de estas líneas o sus intersecciones. También puede ser expresado como un enfoque matemático simplificado que divide a cualquier diseño en tercios, de izquierda a derecha y de arriba a abajo.
Lógica musical
La estructura rítmica o temática de las composiciones musicales se pueden aplicar a las distancias entre elementos en un diseño, como la ABA, ABAC, etc Aprenda más sobre la música y las matemáticas en este artículo de Wikipedia.
Enlaces de interés y de los Recursos
Artículos de la Wikipedia
http://ciberdix.net/site/2010/02/10/la-aplicacin-de-las-matemticas-para-diseo-web-2/
No hay comentarios:
Publicar un comentario