Skip to main content

Scaffolding Relational Schemas and APIs from Content in Web Mockups

  • Conference paper
  • First Online:
Conceptual Modeling (ER 2017)

Part of the book series: Lecture Notes in Computer Science ((LNISA,volume 10650))

Included in the following conference series:

  • 1576 Accesses

Abstract

Web developers often use an interface-driven design process where mockups are gradually refined before being implemented using a platform or framework. We propose a tool, DataMockups, that supports the creation of digital mockups and then generates a relational schema automatically based on sample content and some assumptions on its structure. This aims at reducing development effort, and the database knowledge required by developers. Sample content may be entered manually or automatically using data extracted from similar existing websites. A relational schema is inferred from the data content, and then translated to an SQL database definition before generating a server-side API. To support schema evolution, the generated API provides schema abstractions that offer robustness to future schema modifications. We report on a case study for the schema inference and a performance evaluation of the data detection algorithm.

This is a preview of subscription content, log in via an institution to check access.

Access this chapter

Institutional subscriptions

Notes

  1. 1.

    http://protostrap.ch/.

  2. 2.

    https://balsamiq.com/.

  3. 3.

    https://gomockingbird.com/.

  4. 4.

    http://harthur.github.io/clusterfck/.

  5. 5.

    https://github.com/hoonto/jqgram.

  6. 6.

    http://dev.globis.ethz.ch/datamockups/DataMockups_casestudy.zip.

  7. 7.

    http://www.foodcase.ethz.ch/index_EN.

References

  1. Norrie, M.C., Geronimo, L., Murolo, A., Nebeling, M.: The forgotten many? A survey of modern web development practices. In: Casteleyn, S., Rossi, G., Winckler, M. (eds.) ICWE 2014. LNCS, vol. 8541, pp. 290–307. Springer, Cham (2014). doi:10.1007/978-3-319-08245-5_17

    Chapter  Google Scholar 

  2. Blakeley-Silver, T.: WordPress 2.8 Theme Design: Create Flexible, Powerful, and Professional Themes for Your WordPress Blogs and Websites. Packt Publishing Ltd. (2009)

    Google Scholar 

  3. Yang, F., Gupta, N., Botev, C., Churchill, E.F., Levchenko, G., Shanmugasundaram, J.: WYSIWYG development of data driven web applications. Proc. VLDB Endow. 1(1), 163–175 (2008)

    Article  Google Scholar 

  4. Ramdoyal, R., Cleve, A.: From pattern-based user interfaces to conceptual schemas and back. In: Jeusfeld, M., Delcambre, L., Ling, T.-W. (eds.) ER 2011. LNCS, vol. 6998, pp. 247–260. Springer, Heidelberg (2011). doi:10.1007/978-3-642-24606-7_19

    Chapter  Google Scholar 

  5. Verou, L., Zhang, A.X., Karger, D.R.: Mavo: creating interactive data-driven web applications by authoring HTML. In: Proceedings of 29th Annual Symposium on User Interface Software and Technology, pp. 483–496. ACM (2016)

    Google Scholar 

  6. Murolo, A., Norrie, M.C.: Deriving custom post types from digital mockups. In: Cimiano, P., Frasincar, F., Houben, G.-J., Schwabe, D. (eds.) ICWE 2015. LNCS, vol. 9114, pp. 71–80. Springer, Cham (2015). doi:10.1007/978-3-319-19890-3_6

    Chapter  Google Scholar 

  7. Murolo, A., Norrie, M.C.: Revisiting web data extraction using in-browser structural analysis and visual cues in modern web designs. In: Bozzon, A., Cudre-Maroux, P., Pautasso, C. (eds.) ICWE 2016. LNCS, vol. 9671, pp. 114–131. Springer, Cham (2016). doi:10.1007/978-3-319-38791-8_7

    Chapter  Google Scholar 

  8. Hennicker, R., Koch, N.: A UML-based methodology for hypermedia design. In: Evans, A., Kent, S., Selic, B. (eds.) UML 2000. LNCS, vol. 1939, pp. 410–424. Springer, Heidelberg (2000). doi:10.1007/3-540-40011-7_30

    Chapter  Google Scholar 

  9. Ceri, S., Fraternali, P., Bongio, A.: Web modeling language (WebML): a modeling language for designing web sites. Comput. Netw. 33(1–6), 137–157 (2000)

    Article  Google Scholar 

  10. Houben, G.-J., Barna, P., Frasincar, F., Vdovjak, R.: Hera: development of semantic web information systems. In: Lovelle, J.M.C., Rodríguez, B.M.G., Gayo, J.E.L., Puerto Paule Ruiz, M., Aguilar, L.J. (eds.) ICWE 2003. LNCS, vol. 2722, pp. 529–538. Springer, Heidelberg (2003). doi:10.1007/3-540-45068-8_99

    Chapter  MATH  Google Scholar 

  11. Newman, M.W., Lin, J., Hong, J.I., Landay, J.A.: DENIM: an informal web site design tool inspired by observations of practice. Hum.-Comput. Interact. 18(3), 259–324 (2003)

    Article  Google Scholar 

  12. Rivero, J.M., Heil, S., Grigera, J., Gaedke, M., Rossi, G.: MockAPI: an agile approach supporting API-first web application development. In: Daniel, F., Dolog, P., Li, Q. (eds.) ICWE 2013. LNCS, vol. 7977, pp. 7–21. Springer, Heidelberg (2013). doi:10.1007/978-3-642-39200-9_4

    Chapter  Google Scholar 

  13. Rivero, J.M., Heil, S., Grigera, J., Robles Luna, E., Gaedke, M.: An extensible, model-driven and end-user centric approach for API building. In: Casteleyn, S., Rossi, G., Winckler, M. (eds.) ICWE 2014. LNCS, vol. 8541, pp. 494–497. Springer, Cham (2014). doi:10.1007/978-3-319-08245-5_35

    Chapter  Google Scholar 

  14. Rivero, J.M., Grigera, J., Rossi, G., Luna, E.R., Montero, F., Gaedke, M.: Mockup-driven development: providing agile support for model-driven web engineering. Inf. Softw. Technol. 56(6), 670–687 (2014)

    Article  Google Scholar 

  15. Terwilliger, J.F., Delcambre, L.M.L., Logan, J.: The user interface is the conceptual model. In: Embley, D.W., Olivé, A., Ram, S. (eds.) ER 2006. LNCS, vol. 4215, pp. 424–436. Springer, Heidelberg (2006). doi:10.1007/11901181_32

    Chapter  Google Scholar 

  16. Tai, K.: The tree-to-tree correction problem. J. ACM 26(3), 422–433 (1979)

    Article  MathSciNet  Google Scholar 

  17. Augsten, N., Böhlen, M., Gamper, J.: Approximate matching of hierarchical data using Pq-grams. In: Proceedings of 31st International Conference on Very Large Data Bases, VLDB Endowment (2005)

    Google Scholar 

  18. Crescenzi, V., Mecca, G., Merialdo, P.: Roadrunner: towards automatic data extraction from large web sites. In: Proceedings of 27th International Conference on Very Large Data Bases. Morgan Kaufmann (2001)

    Google Scholar 

  19. Chang, C., Lui, S.: IEPAD: information extraction based on pattern discovery. In: Proceedings of 10th International Conference on World Wide Web. ACM (2001)

    Google Scholar 

  20. Liu, W., Meng, X., Meng, W.: Vide: a vision-based approach for deep web data extraction. IEEE Trans. Knowl. Data Eng. 22(3), 447–460 (2010)

    Article  Google Scholar 

Download references

Acknowledgements

We would like to thank Loris Diana for his work on the realisation of the DB-API-Generator.

Author information

Authors and Affiliations

Authors

Corresponding author

Correspondence to Alfonso Murolo .

Editor information

Editors and Affiliations

Rights and permissions

Reprints and permissions

Copyright information

© 2017 Springer International Publishing AG

About this paper

Cite this paper

Murolo, A., Ehrensberger, S., Asani, Z., Norrie, M.C. (2017). Scaffolding Relational Schemas and APIs from Content in Web Mockups. In: Mayr, H., Guizzardi, G., Ma, H., Pastor, O. (eds) Conceptual Modeling. ER 2017. Lecture Notes in Computer Science(), vol 10650. Springer, Cham. https://doi.org/10.1007/978-3-319-69904-2_12

Download citation

  • DOI: https://doi.org/10.1007/978-3-319-69904-2_12

  • Published:

  • Publisher Name: Springer, Cham

  • Print ISBN: 978-3-319-69903-5

  • Online ISBN: 978-3-319-69904-2

  • eBook Packages: Computer ScienceComputer Science (R0)

Publish with us

Policies and ethics