2013-04-14

40 Recursos para combinar con nuestro desarrollo web basado en Bootstrap


Diseño y tematización.

Uno de los principales critisms cuando se utiliza un marco con botones prediseñados y widgets - es que el producto final puede empezar a buscar cansinas. Bootswatch es un mercado libre tema que tiene por objeto evitar que, con un número de implementaciones de rutina de carga a medida disponibles para descargar de forma gratuita. Su todavía el producto Bootstrap núcleo - sólo con una piel diferente aplicado. Para los diseñadores que necesitan inspiración sobre qué nivel de personalización está disponible, Bootswatch es un buen lugar para comenzar.
Siguiendo en la misma línea - WrapBootstrap es un mercado temático comercial, en la que podrás comprar y vender su tema Bootstrap. Es un gran ejemplo de las crecientes comunidades de nicho en la web alrededor del producto, y ofrece la posibilidad de ver cómo muchas otras personas también han adquirido el mismo tema.
¿Te apetece un enfoque más DIY para requisitos particulares? Bootswatchr proporciona una interfaz visual para que usted pueda utilizar para personalizar los temas de rutina de carga desde cero. Piense en ello como un tema-rodillo (ala jQuery UI ) - que le permite ver de forma interactiva los elementos que se están personalizados en frente de tus ojos. Tres práctico.
También ofrece un conjunto de herramientas de personalización, con la ventaja de que las URL individuales creados se pueden compartir con los demás, mostrando su tema.
JetStrap ofrece una manera fácil extremadamente limpia para construir interfaces de bootstrap, y generar el código de trabajo Bootstrap por el otro lado. Está en algún lugar entre una maqueta y una herramienta de creación de la interfaz, que lleva el manual de codificación de distancia, y hace que sea muy fácil de arrastrar y soltar los componentes Bootstrap en su página y generar una interfaz de trabajo de HTML. Si se encuentra en las primeras etapas de desarrollo de productos, y estamos convencidos de que Manos a la Obra es el marco perfecto para usted en el futuro, entonces te encantará la rapidez JetStrap lo ponga en movimiento.
Ofertas PaintStrap y el enfoque alternativo a Bootstrap tematización. Si usted es un ávidoColourLovers  o Adobe Kuler  usuario, entonces usted simplemente puede introducir el tema directamente en PaintStrap, y Wacks un tema Bootstrap con esos colores bellamente escogidos. Una manera muy simple, pero muy eficaz para hacer que el sitio se vea la parte.
A menudo el caso con los marcos temáticos es que se centran en lo que se necesita desde la perspectiva del diseño FrontEnd. Jump Start han tomado el tema de Manos a la Obra, y lo aplicó a las interfaces de administración, que ofrece implementaciones de primera calidad Bootstrap diseñadas para hacer que sus sistemas backend realmente brillan.
BootTheme es otra herramienta de generación de Tema, sin embargo Boottheme ofrece un enfoque vista previa instantánea, lo que le permite ver los efectos de los cambios en tiempo real. También puede ver cómo los cambios se realizan directamente en varios dispositivos de una manera sensible, lo que lo hace útil en la toma de decisión inicial de diseño.
Kickstrap es un proyecto impulsado por la comunidad añadiendo mejoras a la interfaz Bootstrap marco de interfaz de usuario. Manos a la Obra ha sido adoptado con los brazos abiertos por la mayoría de los desarrolladores de la web. Si bien todas las funciones, algunos pensaron que podrían hacer mejor, y mientras sus sugerencias y peticiones no podría haber llegado a la central de distribución Bootstrap, se han encontrado un hogar en Kickstrap.

Fuentes y tipografía

Con las fuentes haciendo una diferencia fundamental con la aplicación BootStrap estándar, no hay excusa para no personalizar. Este gran artículo te llevará a través de los pasos para lograr que, con una biblioteca de iconos personalizados. En este caso particular, se ha utilizado la popular FamFam conjunto de iconos, pero usted sería factible usar otra cosa.
Fuente impresionante es un proyecto diseñado icono para agregar un cierto nivel de diferenciación de Manos a la Obra. Con la integración en un sinch Manos a la Obra, Font Impresionante también proporciona una hoja de estilo CSS personalizado para su proyecto, así que es una combinación de ambos códigos, y el icono snazziness.
Al igual que sus iconos más, así mínimos? Iconos OpenWeb comenzó a usar fuente impresionante de inspiración, pero se transformó en una colección de iconos de otros fantásticos, especialmente brillantes en escala de grises para más temas.
Esta herramienta le permite combinar WebFonts icónicos para su propio proyecto. Con fontello puede acceder a grandes conjuntos de iconos de calidad profesional de código abierto para su uso dentro de bootstrap.

Fragmentos de código.

BootSnippr proporciona gratuitamente fragmentos de HTML para su uso con Bootstrap. Con todo, desde formularios de registro de perfiles de usuario, que, literalmente, puede copiar y pegar juntos un prototipo de trabajo con el mínimo de código, lo que le permite seguir adelante con las cosas del lado del servidor.
Los fans de Joomla estarán encantados de encontrar que los temas de arranque, componentes y fragmentos de código para Joomla están disponibles en JooStrap. A debe marcar para los desarrolladores de Joomla.
BootStrap WordPress es - sí que has adivinado, un tema de WordPress BootStrap listo.

Plantillas de diseño

Si quieres ir a por todas y personalizar todo alrededor de arranque, entonces puede ser digno de conseguir su diseñador eche un vistazo a algunas de ellas. Con Adobe plantillas PSD, PNG escalabilidad con fuegos artificiales a la asistencia wireframing, estos enlaces deben ayudar con el aspecto más granular de personalización Bootstrap.
Este fantástico Adobe Fireworks ofrece un archivo de base de kit de herramientas de interfaz de usuario de Twitter Bootstrap con la interfaz de usuario completa recreado como imágenes vectoriales en Adobe Fireworks.
Los fans de Photoshop, no se preocupe - hay un montón de PSD que hay ahí fuera para la personalización de Manos a la Obra. Este uno de RepixDesign, es especialmente bien juntos y ser Vector base hace que sea fácilmente escalable.
OmniGraffle si usted no está familiarizado, es una maqueta brillante y una herramienta de wireframes. Esta plantilla proporciona ahora mucha necesidad UI Bootstrap y elementos de navegación a sus plantillas.
Si usted es más de un niño ilustrador, entonces esto EPS debe proporcionar un buen comienzo para la creación de diseños listos Bootstrap.

Componentes de interfaz de usuario

Combustible UX agrega algunos componentes adicionales ordenadas Javascript para Manos a la Obra, incluyendo un ComboBox, DataGrid, Fortín, Buscar y Spinner. Definitivamente vale la pena una visita incluso para un nivel adicional de uñas.

Botones

Proporciona 'Customiser' un botón similar al que se encuentra en algunas de las themers Bootstrap mencionadas antes
Bootstrap Toggle Buttons, por más sexy iPhone interruptores esq.

Editores WYSIWYG para Bootstrap

BootStrap vivo Editor
Tenedor PageDown desarrollado para ajustarse a los principios de Manos a la Obra.
Si en la edición de la página es más su cosa, "Manos a la Obra Editable" es un componente fantástico para el CMS.

Notificaciones / Popups

Aunque Bootstrap tiene su propio motor de notificación, el código para la creación de ellos no es tan simple como añadir una clase CSS. Esto es lo que notify BootStrap trae a la fiesta.
Bootbox.js es una pequeña biblioteca JavaScript que le permite crear cuadros de diálogo utilizando verbos modales programáticas de Twitter Bootstrap, sin tener que preocuparse por la creación, gestión o eliminación de cualquiera de los necesarios elementos DOM o JS controladores de eventos
Pensando en dar recorridos de productos dentro de la aplicación para los nuevos usuarios? Tour de Manos a la Obra es una herramienta fácil de configurar tu Web asistente que guía y orienta a su usuario en torno a su interfaz, enseñándoles las partes Tricker de su interfaz.
Casi todas las aplicaciones requieren una aplicación lightbox de algún tipo. Ya se trate de un cuadro de diálogo modal para iniciar sesión sin salir de la misma página, o para la exhibición de imágenes de gran tamaño.

Selectbox / Combobox / Pickers

Select2 es un reemplazo basado en jQuery para cuadros de selección. Es compatible con la búsqueda, los conjuntos de datos a distancia y el desplazamiento infinito de resultados. Ver y sentir de Select2 se basa en la excelente  Elegido  biblioteca.
Probablemente el Selector de fecha más cool gama encontrarás en la web, y listo de nuevo su mejor Bootstrap.
Si su solicitud tiene entrada sensible al tiempo, entonces TimePicker BootStrap es una mejora de la interfaz de usuario poco aseado que ayuda a asegurar lado más precisa cliente del usuario.
Combobox Bootstrap mejora la combinación estándar, permitiendo que los usuarios escriban su entrada en el teclado, y selecciona automáticamente la entrada correspondiente. Sutil, pero eficaz.
A colourpicker y datepicker de arranque. El colourpicker es particularmente agradable.

Otros extras

¿Necesitas flechas en su interfaz de usuario? Este plugin jQuery simple proporciona Manos a la Obra con una manera fácil de incluir flechas prediseñadas en cualquier ángulo dentro de sus diseños, todo a través del uso de determinadas clases CSS.
BootPag es un plugin jQuery paginación dinámico para bootstrap twitter.
Galería Bootstrap La imagen es una extensión para el cuadro de diálogo modal del conjunto de herramientas Bootstrap de Twitter, para facilitar la navegación entre un conjunto de imágenes de la galería. Cuenta con el ratón y el teclado de navegación, efectos de transición, modo de pantalla completa y la funcionalidad de presentación de diapositivas.
Inspirado por la última encarnación de Windows Metro apps, Bootmetro ofrece la apariencia de ontop Metro de la oferta Bootstrap núcleo. A pesar de que está claro que hay algunos problemas pendientes de ser resueltos (de una sensible POV) sigue siendo un recurso valioso para aquellos que buscan algo diferente estilo sabio.
Arrastrar y soltar constructor de formulario para arranque, que genera el código HTML que hay que traer a la vida. Handy.
Algunos diseños de página adicionales no incluidos en el marco de arranque. Las muestras se pueden ver rápidamente aquí. 

4 comentarios:

Daniel Santarriaga (ADMIN) dijo...

Muchas gracias por tu aportación!!! ;) visto desde la comunidad PHP en español de Linkedin

Daniel Santarriaga (ADMIN) dijo...
Este comentario ha sido eliminado por un administrador del blog.
Daniel Santarriaga (ADMIN) dijo...

Muchas gracias por tu aportación!!! ;) visto desde la comunidad PHP en español de Linkedin

Anis Marrouchi dijo...

Una gran lista, esperamos que mantengan actualizada, aquí es otro recursos gratuitos alojados en twittstrap github en twittstrap.com/twittstrap