ExerClick: aplicación móvil para el seguimiento de ejercicios en clase

Se ha implementado la aplicación para el seguimiento de ejercicios en el aula llamada exerClick. Es una aplicación multiplataforma para móviles, evaluada en Android y en iOS y adaptada a esos sistemas gracias a la plataforma Apache Cordova. En su implementación se han utilizado las tecnologías web HTML5, CSS3 y Javascript, además de PHP para el servidor. La aplicación permite que los profesores añadan ejercicios y los alumnos le envíen feedback sobre su realización mediante dos opciones: marcar una duda en el ejercicio o marcar el ejercicio como finalizado.

Estudo de Funcionalidades HTML5 para um Editor de Imagem na Internet

Hoje em dia existem múltiplas aplicações multimédia na Internet, sendo comum qualquer website apresentar mais de uma forma de visualização de informação além do texto como, por exemplo: imagens, áudio, vídeo e animação. Com aumento do consumo e utilização de Smartphone e Tablets, o volume de tráfego de internet móvel tem vindo a crescer rapidamente, bem como o acesso à internet através da televisão. As aplicações web-based ganham maior relevância devido à maior partilha ou consumo de conteúdos multimédia, com ou sem edição ou manipulação da mesma, através de redes sociais, como o Facebook. Neste documento é apresentado o estudo de alternativas HTML5 e a implementação duma aplicação web-based no âmbito do Mestrado de Engenharia Informática, ramo de Sistemas Gráficos e Multimédia, no Instituto Superior Engenharia do Porto (ISEP). A aplicação tem como objetivo a edição e manipulação de imagens, tanto em desktop como em dispositivos móveis, sendo este processo exclusivamente feito no lado do cliente, ou seja, no Browser do utilizador. O servidor é usado somente para o armazenamento da aplicação. Durante o desenvolvimento do projeto foi realizado um estudo de soluções de edição e manipulação de imagem existentes no mercado, com a respetiva análise de comparação e apresentadas tecnologias Web modernas como HTML5, CSS3 e JavaScript, que permitirão desenvolver o protótipo. Posteriormente, serão apresentadas, detalhadamente, as várias fases do desenvolvimento de um protótipo, desde a análise do sistema, à apresentação do protótipo e indicação das tecnologias utilizadas. Também serão apresentados os resultados dos inquéritos efetuados a um grupo de pessoas que testaram esse protótipo. Finalmente, descrever-se-á de forma mais exaustiva, a implementação e serão apontadas dificuldades encontradas ao longo do desenvolvimento, bem como indicadas futuras melhorias a introduzir.

Take Care4All: Gestor Pessoal para o Bem-Estar na Saúde, Exercício Físico e Alimentação

Este trabalho de Projecto consiste numa plataforma online que possibilita ao seu utilizador gerir simultaneamente a saúde, o exercício físico e o regime alimentar. A plataforma é uma ferramenta que ajuda a promover o bem-estar do indivíduo, porque auxilia a monitorizar a toma de medicação e a agendar consultas e/ou exames. Permite ainda identificar o exercício físico e a dieta adequada para o estado de saúde do utilizador, através do teste de aptidão física e das calculadoras de IMC, TMB e NCD. Para o desenvolvimento da plataforma foram considerados os princípios da usabilidade e acessibilidade heurística de Jacob Nielsen. O desenvolvimento do projecto assenta nas linguagens de Programação de HTML5, CSS3, PHP, MySQL, Javascript (JQuery) e na plataforma de RWD do Twitter-Bootstrap.

Web 1, 2 and 3

Lecture on IA and webdesign (1 & 2 of 3). Web 2 talk I reference Aral Balkan - talk video is included here from his presentation at the Norwegian developers conference.

Introduction to HTML5

Covers HTML5 design principals and key changes. Outlined are new and retired elements, changes to forms and media support. This lecture then also covers key changes to CSS3 and JavaScript which support the development and implementation of HTML5

Progettazione e realizzazione di un sito web e-commerce per l'editoria utilizzando la piattaforma Magento

La tesi analizza e approfondisce vari concetti tra cui l'e-commerce e il suo impatto nel mercato degli ultimi decenni, le fasi progettuali di un sito web, i linguaggi principali sullo sviluppo web, la piattaforma Magento e le sue funzionalità. Dopo lo studio e l'analisi di tali concetti si è passato alla fase di realizzazione del sito web applicando le conoscenze e gli strumenti base della programmazione web come i linguaggi PHP, HTML5, CSS3 e JavaScript.

Analisi, progettazione e sviluppo di un e-commerce con framework magento

Progettazione e sviluppo di un e-commerce di articoli sacri utilizzando Magento come framework. Introduzione agli strumenti e tecniche di creazione per un catalogo.

Elementi di Gamification applicati all'apprendimento della matematica

L'obiettivo di questo lavoro è stato lo studio e lo sviluppo di un'applicazione mobile, che favorisca l'apprendimento scolastico tramite l'uso di tecniche di Gamification. L'app è stata creata con l'intenzione di focalizzarsi in particolare sulla matematica, ma è stata progettata in maniera modulare con diverse funzioni e costrutti parametrizzati, più facilmente gestibile e in futuro ampliabili. Il lavoro è iniziato con l'analisi delle esigenze degli studenti relative allo studio della matematica, ed in particolare si è approfondito la necessità di aiutare gli alunni nell'apprendimento di questa disciplina, attraverso esercizi mirati e con elementi di gioco gamificati.

CloudRoom: una plataforma universitaria social, semántica y ubicua

Estamos viviendo la era de la Internetificación. A día de hoy, las conexiones a Internet se asumen presentes en nuestro entorno como una necesidad más. La Web, se ha convertido en un lugar de generación de contenido por los usuarios. Una información generada, que sobrepasa la idea con la que surgió esta, ya que en la mayoría de casos, su contenido no se ha diseñado más que para ser consumido por humanos, y no por máquinas. Esto supone un cambio de mentalidad en la forma en que diseñamos sistemas capaces de soportar una carga computacional y de almacenamiento que crece sin un fin aparente. Al mismo tiempo, vivimos un momento de crisis de la educación superior: los altos costes de una educación de calidad suponen una amenaza para el mundo académico. Mediante el uso de la tecnología, se puede lograr un incremento de la productividad, y una reducción en dichos costes en un campo, en el que apenas se ha avanzado desde el Renacimiento. En CloudRoom se ha diseñado una plataforma MOOC con una arquitectura ajustada a las últimas convenciones en Cloud Computing, que implica el uso de Servicios REST, bases de datos NoSQL, y que hace uso de las últimas recomendaciones del W3C en materia de desarrollo web y Linked Data. Para su construcción, se ha hecho uso de métodos ágiles de Ingeniería del Software, técnicas de Interacción Persona-Ordenador, y tecnologías de última generación como Neo4j, Redis, Node.js, AngularJS, Bootstrap, HTML5, CSS3 o Amazon Web Services. Se ha realizado un trabajo integral de Ingeniería Informática, combinando prácticamente la totalidad de aquellas áreas de conocimiento fundamentales en Informática. En definitiva se han ideado las bases de un sistema distribuido robusto, mantenible, con características sociales y semánticas, que puede ser ejecutado en múltiples dispositivos, y que es capaz de responder ante millones de usuarios. We are living through an age of Internetification. Nowadays, Internet connections are a utility whose presence one can simply assume. The web has become a place of generation of content by users. The information generated surpasses the notion with which the World Wide Web emerged because, in most cases, this content has been designed to be consumed by humans and not by machines. This fact implies a change of mindset in the way that we design systems; these systems should be able to support a computational and storage capacity that apparently grows endlessly. At the same time, our education system is in a state of crisis: the high costs of high-quality education threaten the academic world. With the use of technology, we could achieve an increase of productivity and quality, and a reduction of these costs in this field, which has remained largely unchanged since the Renaissance. In CloudRoom, a MOOC platform has been designed with an architecture that satisfies the last conventions on Cloud Computing; which involves the use of REST services, NoSQL databases, and uses the last recommendations from W3C in terms of web development and Linked Data. For its building process, agile methods of Software Engineering, Human-Computer Interaction techniques, and state of the art technologies such as Neo4j, Redis, Node.js, AngularJS, Bootstrap, HTML5, CSS3 or Amazon Web Services have been used. Furthermore, a comprehensive Informatics Engineering work has been performed, by combining virtually all of the areas of knowledge in Computer Science. Summarizing, the pillars of a robust, maintainable, and distributed system have been devised; a system with social and semantic capabilities, which runs in multiple devices, and scales to millions of users.

Seguimiento de la actividad de pacientes en ensayos clínicos en redes sociales y otros repositorios públicos

Actualmente nos encontramos en la era de Internet y las nuevas tecnologías. Esto supone que queremos utilizar Internet para casi cualquier problema que se nos presente hoy en día. Al mismo tiempo vivimos un momento en el que los ensayos clínicos están siendo cruciales para la cura de enfermedades, algo que supone si no el más sí uno de los aspectos más importantes en nuestra vida. Pero el seguimiento de los ensayos clínicos presenta el problema de que finalizados tras cinco años de duración, toda comunicación con los pacientes que participaron en ellos se pierde y volver a contactar con ellos se convierte en una tarea ardua. De estas ideas básicas surge el desarrollo de este proyecto. Se ha querido unir las nuevas tecnologías y el beneficioso uso de Internet con la posibilidad de encontrar a pacientes sin tener que perder demasiado tiempo en ello y sin molestar a nadie por el camino. La aplicación que se plantea en este proyecto es, por tanto, una aplicación web basada en PHP, HTML5 y CSS3 que sea capaz de leer información personal de pacientes almacenada en CRFs y que con ella realice búsquedas en redes sociales destinadas a la medicina y así, de esta manera, poder constatar qué ha sido del paciente. Para ello primero se tendrá que realizar un exhaustivo estudio de las redes sociales y repositorios electrónicos clínicos que hay actualmente en el mercado. Una vez identificados estos recursos y sus posibles elementos de desarrollo se estudiarán las herramientas de manejo de Case Report Forms disponibles, que sean de código abierto, para poder usarlas como punto de lectura de los datos del paciente. Una vez disponible esta información sólo será necesario hacer que la aplicación lea los datos y realice las búsquedas en las redes sociales seleccionadas. En definitiva, se ha diseñado un sistema que facilite el seguimiento de pacientes de estudios clínicos al equipo médico.

A CAD development strategy for the next years

This paper suggests a new strategy to develop CAD applications taking into account some of the most interesting proposals which have recently appeared in the technology development arena. Programming languages, operating systems, user devices, software architecture, user interfaces and user experience are among the elements which are considered for a new development framework. This strategy considers the organizational and architectural aspects of the CAD application together with the development framework. The architectural and organizational aspects are based on the programmed design concept, which can be implemented by means of a three-level software architecture. These levels are the conceptual level based on a declarative language, the mathematical level based on the geometric formulation of the product model and the visual level based on the polyhedral representation of the model as required by the graphic card. The development framework which has been considered is Windows 8. This operating system offers three development environments, one for web pplications (HTML5 + CSS3 + JavaScript), and other for native applications C/C++) and of course yet another for .NET applications (C#, VB, F#, etc.). The use rinterface and user experience for non-web application is described ith XAML (a well known declarative XML language) and the 3D API for games and design applications is DirectX. Additionally, Windows 8 facilitates the use of hybrid solutions, in which native and managed code can interoperate easily. Some of the most remarkable advantages of this strategy are the possibility of targeting both desktop and touch screen devices with the same development framework, the usage of several programming paradigms to apply the most appropriate language to each domain and the multilevel segmentation of developers and designers to facilitate the implementation of an open network of collaborators.

Herramienta EN 301 549: cliente web

En el año 2014 se publicó, bajo mandato de la Comisión Europea, la Norma Europea EN 301 549, titulada “Requisitos de accesibilidad de productos y servicios TIC aplicables a la contratación pública en Europa”. El objetivo de dicha norma es que los productos o servicios TIC (Tecnologías de la Información y la Comunicación) adquiridos por cualquier administración pública europea puedan ser utilizados por personas con diversas características y capacidades, incluyendo a personas con discapacidad. La norma EN 301 549 es compleja, ya que contiene más de 200 requisitos y recomendaciones, que se aplican o no a un producto o servicio TIC en función de las características de dicho producto o servicio. Por ello se ha planteado, desde el Grupo de Investigación en Tecnología Informática y de las Comunicaciones (CETTICO), el desarrollo de una herramienta de soporte a la evaluación del cumplimiento de la norma. La herramienta permitirá a grupos de trabajo anotar los resultados de la evaluación de accesibilidad de un producto o servicio TIC siguiendo los requisitos de la norma Europea EN 301 549. Este trabajo de Fin de Grado se centra en el diseño y codificación del cliente web de la herramienta. Se parte de los resultados de un TFG y un practicum anteriores. En el TFG realizado por Laura Elorrieta [Elorrieta, 2014], se diseñó la interacción del sistema y se evaluó su grado de usabilidad. En el practicum [Montero, 2015], posterior al TFG de Laura Elorrieta, se eligieron las tecnologías web que se iban a utilizar y se realizó el diseño y la implementación mediante prototipos iterativos de la gestión de proyectos de evaluación. El trabajo que se ha realizado en el TFG ha consistido en el diseño de la interfaz de usuario analizando los cambios a realizar en el diseño, debido a los errores de usabilidad conocidos, y la implementación del prototipo funcional de la herramienta. Junto con la parte servidor del TFG de mi compañero Rubén Ortiz Burgos y la interfaz de usuario de este TFG se ha obtenido una aplicación web para realizar evaluaciones de accesibilidad de productos o servicios TIC siguiendo los requisitos de la norma EN 301 549. El prototipo funcional contiene diez páginas web que recogen las diferentes acciones y tareas que pueden realizar los usuarios en función del rol que desempeñen. EL diseño y la implementación se han llevado a cabo empleando las tecnologías web HTML5, CSS3, JavaScript, jQuery y las librerías de Foundation frontend framework.---ABSTRACT---In 2014, under the European Commission mandate, the European standard EN 301 549 has been published under the title “Accessibility requirements applicable to ICT products and procurement services in Europe”. The goal of this standard is that the products or services ICT (Information Communication Technology) acquires by every European public administration can be used by every person with different characteristics and capacities, including those with disability. The rule EN 301549 is very complex, since it has more than 200 requirements and recommendations that can be or not applied to an ICT product or service based on its characteristics of the given product or service. That’s why a development of a support tool has been proposed to the rating of the compliance of the rule, by the Research Group of Informatics Technology and Communication. This tool will allow working groups to record the results of the compliance of accessibility of a product or service following the requirements of the European Standard EN 301549. This Final Degree Work focuses in the design and the coding of the web customer of this tool. The results of a TFG and previous practicums have been used for this. The TFG performed by Laura Elorrieta [Elorrieta, 2014], the interaction of the system was designed and degree of usability was evaluated. In the practicum [Montero, 2015], after the TFG Laura Elorrieta, web technologies used were chosen and the design and implementation were performed using iterative prototyping project management evaluation. The work done on the TFG was to design the users interface to perform analyzing changes in design due to errors known usability and working prototype implementation of the tool. Together with the server part of the TFG my partner Rubén Ortiz Burgos and the user interface done of this TFG it has obtained a web application for the conduct of evaluations accessibility of products or services ICT following the requirements of the EN 301 549. The functional prototype contains ten web sites that collect the various activities and tasks that users can perform based on the role they perform. The design and implementation have been carried out using the technologies web HTML5, CSS3, Java Script, jQuery and the libraries of Foundation fronted framework.

Demo: Shield UI JavaScript Chart - A Flexible HTML5 Data Visualization Component

Shield UI’s advanced framework for creating rich charts and graphs is the first of a line of data visualization components, giving web developers the power for embedding rich graphics in their web projects with minimum effort. Built with HTML, CSS3 and packaged as a jQuery plugin, the library has full support for legacy and modern desktop web browsers, as well as the latest mobile devices.

Gestengestützte Schema- und Datenexploration

Der Zugang zu Datenbanken über die universelle Abfragesprache SQL stellt für Nicht-Spezialisten eine große Herausforderung dar. Als eine benutzerfreundliche Alternative wurden daher seit den 1970er-Jahren unterschiedliche visuelle Abfragesprachen (Visual Query Languages, kurz VQLs) für klassische PCs erforscht. Ziel der vorliegenden Arbeit ist es, eine generische VQL zu entwickeln und zu erproben, die eine gestenbasierte Exploration von Datenbanken auf Schema- und Instanzdatenebene für mobile Endgeräte, insbesondere Tablets, ermöglicht. Dafür werden verschiedene Darstellungsformen, Abfragestrategien und visuelle Hints für Fremdschlüsselbeziehungen untersucht, die den Benutzer bei der Navigation durch die Daten unterstützen. Im Rahmen einer Anforderungsanalyse erwies sich die Visualisierung der Daten und Beziehungen mittels einer platzsparenden geschachtelten NF2-Darstellung als besonders vorteilhaft. Zur Steuerung der Datenbankexploration wird eine geeignete Gestensprache, bestehend aus Stroke-, Multitouch- und Mid-Air-Gesten, vorgestellt. Das Gesamtkonzept aus Darstellung und Gestensteuerung wurde anhand des im Rahmen dieser Arbeit entwickelten GBXT-Prototyps auf seine reale Umsetzbarkeit hin, als plattformunabhängige Single-Page-Application für verschiedene mobile Endgeräte mittels JavaScript und HTML5/CSS3 untersucht.

Un entorno de test colaborativo en JavaScript para Siette

En este proyecto nosotros vamos a hacer una pasada por un sistema colaborativo de resolución de test. En este entorno el estudiante resuelve preguntas en un grupo de estudiantes en tres fases diferentes (individual, colaborativa y final). Este sistema ha demostrado que los alumnos que resuelven los test en este entorno mejoran sus respuestas. Esto se debe a que los estudiante aprenden como sus compañeros se enfrentan a las cuestiones planteadas y como las resuelven. Este sistema esta actualmente funcionando en la plataforma siette, pero esta teniendo problemas de compatibilidad con algunos navegadores y esto presenta un problema para desarrollar nueva funcionalidad. Nosotros queremos resolver esto con la utilización de HTML5, CSS y JavaScript. Este Sistema será diseñado para funcionar en conjunto con la plataforma de resolución de tests (Siette) en un modo que llamaremos modo colaborativo que solo será usado para resolver test en grupo con otros compañeros. Siette nos propone un entorno donde trabajan profesores diseñando test y alumnos que testean su conocimiento.