Custom List Style with Sharepoint 2010
Posted by Wigo | Filed under General
Con la salida de la BETA de Sharepoint 2010 han cambiado bastantes cosas en lo que a interacción de usuario y branding se refiere que con la anterior versión eran un autentico dolor de cabeza.
Una de las mejoras ha sido el manejo de estilos para listas y elementos de lista.
Gracias a las nuevas opciones de customización de estilos que nos proporciona el sharepoint designer, podemos cambiar tanto el estilo de cada elemento generado y el layout que adoptará nuestra lista.
Vamos a hacer un pequeño ejemplo para cambiar el layout y el estilo de nuestra lista sin tocar el XSLT (nos lo generará el designer)
Para ello, vamos a una pagina e insertamos en algun contentPlaceholder una lista que hayamos creado anteriormente (no hace falta introducir la lista como item de un content query web part) simplemente insertamos la lista directamente.
Con el Placeholder en la vista diseño, o posicionándonos dentro del placeholder en la vista código, vamos a insertar -> vista de datos y seleccionamos nuestra lista o biblioteca de documentos (en nuestro caso estamos insertando una biblioteca de assets) que soporta video y audio.
La lista se insertará en la vista de lista predeterminada.
Lo primero que haremos será cambiar el layout.
Con nuestra lista seleccionada se desplegarán nuevas opciones en el ribbon
Nos vamos a diseño y seleccionamos el layout que más nos convenga. Por ejemplo seleccionamos el layout boxed, a dos columnas, y tendremos nuestros elementos agrupados en cajas de dos en dos, (algo bastante engorroso de hacer en 2007)
Vemos nuestros elementos de la lista de librería de assets colocados en cajas, a dos columnas,
Vamos ahora a seleccionar los campos que nos interesan mostrar
Nos vamos a opciones -> agregar o quitar columnas, y nos aparecerá un menú para agregar o quitar campos (propios de la librería o que hayamos agregado nosotros) también podemos elegir el orden de aparición de dichos campos moviendolos arriba y abajo.
Bien, una vez que tenemos nuestra lista con los campos necesarios y el layout que más nos convenga (sin dolor) pasamos a estilar los elementos. Para que se ajusten por ejemplo a una hoja de estilos que hemos creado previamente.
Con el elemento al que queremos cambiar el estilo seleccionado, clickeamos en estilo -> elemento seleccionado
Se nos abre una ventana emergente con las opciones de estilo especificas para el elemento seleccionado
El propio designer nos genera el codigo para ese elemento concreto y nos lo añade con una etiqueta span, al que le aplica un estilo generado
Ahora solo tenemos que cambiar la clase "style1" para que ese elemento adquiera el estilo referenciado en nuestro css y listo, asi de facil e indoloro.
Tags: custom, list, sharepoint, sharepoint 2010, sharepoint designer, style, xstl
Pol 3.14 aparece con Silverlight
Posted by Wigo | Filed under Diseño, Tecnología
Pol, el nuevo cantante de los hombres de Paco, ha hecho su aparición estelar en los medios con esta pedazo de web en Silverlight!
Tags: plain concepts, POL, silverlight
UX de Plainconcepts en portada de Silverlight.net
Posted by Wigo | Filed under General
El Showcase de plainconcepts aparece en la portada de la web internacional de Silverlight, nada mas y nada menos que en puesto 1. congratulations !
Enlace al portal | Silverlight.NET
Experiencia Silverlight para Joaquín Sabina
Posted by Wigo | Filed under Diseño, Tecnología
El nuevo videoclip de Joaquín Sabina viene aderezado con la tecnología Silverlight, enriqueciendo la experiencia de usuario.
Ver el site: http://joaquinsabina.es.msn.com/
Tags: joaquin sabina, microsoft, plain concepts, silverlight
Hypnostate anuncia nuevos conciertos
Posted by Wigo | Filed under Musica
Estos son los próximos conciertos anunciados para los próximos meses
- 20 feb 2010 22:00 | CAPITAN HADDOCK | Alcorcón, Madrid
- 13 mar 2010 20:00 | SALA CALLE 32 | Sevilla, Sevilla
- 23 abr 2010 21:00 | SALA TAF | Móstoles, Madrid
- 24 abr 2010 20:00 | SALA EL LAGO | Vallecas, Madrid
- 19 jun 2010 20:00 | SALA EL GRITO | Fuenlabrada, Madrid
- 10 jul 2010 20:00 | Sala LEMON | Madrid, Madrid
esperamos veros en alguno de ellos !!
![hypnostateelocho88d8d8d[1]](http://www.esferanegra.com/wp-content/uploads/hypnostateelocho88d8d8d1.jpg "hypnostateelocho88d8d8d[1]")
Tags: conciertos, hypnostate
MIX 2010 10kbs Contest
Posted by Wigo | Filed under Diseño, Tecnología
Ricardo Acosta, una eminencia en las interfaces de usuario y gran amigo mío, está participando en el concurso MIX 10kbs, que consiste en hacer una aplcación Silverlight en 10kbs, es un juego de física con haces de luz bastante chulo.
podéis verlo aquí
http://mix10k.visitmix.com/Entry/Details/238
Si os ha gustado, porfavor votadlo !!
Tags: mix 2010, ricardo acosta, silverlight, ux
Making off – Today the End of Days
Posted by Wigo | Filed under Musica
Tags: cecilia gessa, hypnostate, kiko prada
Propuestas de Plain Concepts para el Mix 2010 !
Posted by Wigo | Filed under Tecnología
Desde Plain Concepts hemos hecho las siguientes propuestas de charlas para el Mix 2010:
BECOMING SOCIAL. How to power up your website using social networks
PLAIN CONCEPTS’ SILVERLIGHT LIVE MESSENGER TOOLKIT
SILVERLIGHT IN THE AUDIOVISUAL WORLD
EXTENDING THE WINDOWS LIVE MESSENGER WEB TOOLKIT WITH SCRIPT# AND SILVERLIGHT
WHAT YOU SEE IS NOT WHAT IS THERE. Users mind as a resource in Expression Blend
Solo pediros que, si os parece interesantes y son de vuestro agrado, votéis por ellas para que salgan elegidas, prometemos no defraudar 
Muchas gracias a todos por vuestro interes y colaboración
Tags: mix 2010, plain concepts
This is War
Posted by Wigo | Filed under Musica
Después de 4 años de estar quien sabe donde, la banda liderada por Jared Leto tiene listo lo que será el sucesor del extra vendido A Beatiful Lie (2005). Lo que será su tercer disco de estudio ya está titulad como This is War y saldrá a la venta el 8 de diciembre.
Son 12 canciones producidas por Flood y 30 Seconds to Mars. Más abajo podrás ver el tracklist. En una primera escucha he de decir que…. los 30 se han superado a si mismos con un disco EPICO…
Track listing
Tags: 30 seconds to mars, jared leto, this is war
Ahorra tiempo con Photoshop Layer Comp
Posted by Wigo | Filed under Diseño, Tutoriales
Una de las tareas más engorrosas a la hora de diseñar interfaces es exportar todas las pantallas, que hemos ido diseñando, con sus menús, submenús, acciones, animaciones etc.. Recordando siempre las capas o conjunto de capas que tenemos que habilitar/deshabilitar para formar todas las secciones.
Pues bien, nuestra querida aplicación Photoshop, incluye una funcionalidad llamada Layer Comps, que, lo que hace básicamente, es grabar los estados de visibilidad/invisibilidad de todas nuestras capas en un instante determinado. Dándoles un nombre y pudiendo añadir una descripción.
Vamos a ver un ejemplo:
Tenemos un avatar de messenger que al hacer click sobre él, nos desplegará un menú, y la ultima acción del menú (otras posibilidades) desplegará un submenú
En nuestro diseño, el avatar seria el grupo de capas llamada Avatar, el menú seria el grupo options y el submenú seria el grupo morePossibilities
![clip_image001[6]](http://www.esferanegra.com/wp-content/uploads/clip_image0016.png "clip_image001[6]")
Vamos a ir grabando la navegación de este sencillo menú, con Layer Comps. Para ello abrimos el panel de layer comps (window > layer comps)
Ahora para el primer paso, deshabilitamos options, de esta manera solo se verá el avatar puesto que morPossibiilities esta dentro de options
Ahora nos vamos al panel de layer comps y creamos una nueva layer comp
Nos pedirá introducir un nombre , jugar con la visibilidad, o grabar su posición para realizar animaciones, también cambiar el estilo de la capa, a su vez, podremos introducir un comentario descriptivo sobre esta composición. En nuestro caso AvatarBase.
![clip_image001[8]](http://www.esferanegra.com/wp-content/uploads/clip_image0018.png "clip_image001[8]")
A continuación deshabilitamos la capa morePossibiliities y habilitamos la capa optiones, y nos vamos a layer comp y guardamos una nueva comp.
![clip_image001[10]](http://www.esferanegra.com/wp-content/uploads/clip_image00110.png "clip_image001[10]")
Importante: realizar primero el switch de visibilidad en las capas y por ultimo guardar el estado, a este segundo estado lo llamaremos AvatarPressedMenu.
Por ultimo quedaría habilitar el grupo morePossibilities y crear una nueva layer comp. Llamada AvatarPressedSubmenu.
![clip_image001[12]](http://www.esferanegra.com/wp-content/uploads/clip_image00112.png "clip_image001[12]")
Usando los controles de layer comp (flechas) podemos ir avanzando o retrocediendo en nuestra navegación.
Y ya tenemos nuestra navegación simple creada. PERO AHORA VIENE LO MEJOR !!!
De la manera habitual, tendríamos que ir seleccionando el estado y guardando nuestra imagen, darle un nombre y así sucesivamente… pero teniendo nuestras composciones ya creadas podemos exportarlas automaticamente con un script, y nuestro querido photoshop nos generará una exportación de todas las capturas…
Por tanto, ahora nos vamos a File > Scripts > Layer Comps to Files
![clip_image001[14]](http://www.esferanegra.com/wp-content/uploads/clip_image00114.png "clip_image001[14]")
![clip_image001[16]](http://www.esferanegra.com/wp-content/uploads/clip_image00116.png "clip_image001[16]")
En la ventana emergente elegimos la carpeta destino, el prefijo de nuestro nombre, que se genera automáticamente (prefijo_numerodelayercomp_nombrelayercomp.filetype)
Seleccionamos también el tipo de archivo a generar, y clickeamos sobre “Run”
El Photoshop empezará a correr el script, mostrándonos un mensaje de finalización
![clip_image001[18]](http://www.esferanegra.com/wp-content/uploads/clip_image00118.png "clip_image001[18]")
Y aquí tenemos nuestros archivos generados ON THE FLY…. recién salidos del horno.
![clip_image001[20]](http://www.esferanegra.com/wp-content/uploads/clip_image00120.png "clip_image001[20]")
RAPIDO SENCILLO Y PARA TODA LA FAMILIA….. Y lo mejor de todo es… AHORRAMOS SUFRIMIENTO Y TIEMPO.
Tags: layer comp, photoshop, ux
